Membuat cek ongkir dengan javascript

Selamat datang sahabat keping kode.
Artikel kali ini membahas bagaimana cara membuat cek ongkir dengan PHP atau membuat cek ongkir di website yang akan kita buat.

Disini akan saya tuliskan dasar-dasar nya saja. Silahkan ikuti step by step nya, dan jangan lupa bantuan nya dengan mengeklik tombol Subscribe agar saya rajin membuat artikel dan konten youtube nya.

Pada artikel dan tutorial ini kurir nya dengan JNE ya.

Berikut langkah-langkah nya:

Silahkan kalian buat terlebih dahulu form dan field nya.

Field yang dibutuhkan yaitu Kecamatan Tujuan, Kota Tujuan, Berat. Untuk asal paket kita defaultkan saja dari area masing-masing ya. Kurang lebih tampilan nya akan seperti dibawah ini.
Baiklah saya jelaskan sedikit keterangan field-field yang ada di atas:
<input type="hidden" id="origin" value="17">
Karena Asal nya adalah Badung maka origin nya 17. Kalian bisa coba cari sendiri origin nya dengan menggunakan aplikasi POSTMAN.

Terdapat juga.
<select class="form-control" id="provinsi" onclick="getKab()">
      <option disabled="" selected="">Pilih Provinsi</option>
</select>
jadi ada event onclick atau saat diklik makan fungsi getKab() akan di panggil.

<select class="form-control" id="kabupaten">
</select>
Kabupaten di sini akan diisi saat kalian memilih provinsi pada event onclick.

<input class="form-control" id="berat">
Berat yang diisi dalam satuan gram.

Terakhir di tombol nya terdapat event onclick.
<button class="btn btn-primary form-control" onclick="cekOngkir()">Cek</button>
Jadi saat kita klik tombol nya, maka fungsi cek ongkir nya baru berfungsi. Kalian bisa kembangkan sesuai kebutuhan masing-masing.

Untuk tampilannya tidak perlu mirip atau sama persis dengan gambar di atas ya, karena itu hanya contoh saja. Yang penting field-field yang ada di gambar sudah ada di script kalian agar fungsinya bisa berjalan dan tidak terjadi error.

Selanjut nya di bagian paling bawah, lebih tepat nya di atas tag </body> buatkan tag untuk menulis javascript. Atau jika kalian ingin javascript nya di file terpisah juga bisa.

Jika sudah kalian bisa tulis script di bawah ini:


Pada box di atas adalah fungsi javascript nya. Jika masih bingung dengan cara kerja nya atau bingung ngelihat script nya, bisa langsung bertanya lewat DM instagram disini 

Sekali lagi jika berkenan mohon bantuan nya dengan mengeklik subscribe di atas ya.

Kalian juga bisa download Source Code pada tutorial diatas di link berikut:
Mediafire - Google Drive

Tutorial Video nya bisa di Youtube saya, Klik Disini




Tag :
tutorial cek ongkir dengan javascript,
cek ongkir dengan ajax,
membuat ongkir pada web sendiri,
cara buat ongkir paling gampang.

No comments

Powered by Blogger.