Contoh11 (Form)

Agustus 18, 2020 Fajar (Ucup) 0 Komentar pemrograman

Contoh11 (Form) : Webpro

Komponen Form

Dalam FORM HTML terdapat beberapa komponen yang bisa digunakan, antara lain :

Pengolahan Data Dari Form

Form di HTML dikenal dengan adanya tag
dan ditutup dengan tag
. Di dalam tag pembuka
diikuti dengan atribut action dan method. Action menjelaskan ke halaman yang digunakan untuk memproses input, sementara method digunakan untuk mengatur cara memparsing konten

Web menerima input dari user atau pengunjung menggunakan metode GET dan POST. GET akan mengirimkan data bersama dengan URL, sedangkan POST akan mengirimkannya secara terpisah. User mengirimkan data input dengan mengisi teks atau pilihan pada attibut form html.

Form menggunakan Metode Get

Sebagai Contoh silakan kalian buka aplikasi notepad++ kalian ataupun sublime text. lalu ketikan atau masukan coding berikut:

Contoh 11 FORM METODE GET

Masukkan nama :

Penjelasan coding :

form action="outputget.php" ; form itu ibarat formulir yang kita isi saat mendaftar dan menulis manual , outputget.php itu seperti tujuan atau petugas yang mengurus,jadi kemana arah form ini akan kita kirim nntinya atau kita serahkan ke siapa.,dan form ini nntinya mengarah ke "outputget.php"

method="get" ; ada dua metode untuk form ada get dan post nanti akan saya jelaskan perbedaannya.

Masukkan nama : ; sama seperti dipemograman lain seperti visual basic netbeans dan sebagainya yang memiliki form pasti memiliki textfield textarea dan sebagainya,nah untuk membuat textfield pada form itu codingnya input type="text" ,dan tentu pasti harus diberi variabel nama text field tersebut name="nama".

input type="submit" value="proses" ; membuat button submit yang akan mengarah sesuai form action yaitu outputget.php , dan value="proses" ini adalah text yang tampil di button tersebut

Simpan file di atas di dalam folder c:XAMPPhtdocs '(jgn lupa instal dan run xampp)' buat folder baru untuk menyimpan file didalam folder htdocs. Simpan file dengan nama inputanget.php.
Untuk melihat hasil dari file di atas dapat menggunakan browser Mozilla, google chrome, internet explorer atau jenis browser lain. Ketikkan pada address bar “LocalhostNama Folder Penyimpanan”,kemudian pilih file inputanget.php

Ini baru inputget.phpnya nah sekarang waktunya kita buat outputget.php agar button proses dapat bekerja.

ketikan atau masukan coding berikut:

Output Get

Data Nama Yang Tadi Di Input Adalah :

Penjelasan Coding :

; karna form inputannya menggunakan method get maka untuk menampilkannya pun haru dengan "_GET" lalu diikuti dengan variabel namenya ["nama']

Simpan file didalam folder yang sama dengan inputanget.php. Simpan file dengan nama outputget.php.

Hasil setelah button proses di inputanget.php diklik.

Lihat tanda panah ada nilai dari variabel nama yaitu nama=fajar+yusuf , ini dikarenakan memakai metode GET

Sekarang kita coba Method POST

Form menggunakan Metode Post

Sebagai Contoh silakan kalian buka aplikasi notepad++ kalian ataupun sublime text. lalu ketikan atau masukan coding berikut:

Form Metode Post

Penjelasan coding :

sama seperti penjelasan pada metode get hanya ini diganti methode ="post".

dan form action="outputpost.php"

Simpan file di atas di dalam folder c:XAMPPhtdocs '(jgn lupa instal dan run xampp)' buat folder baru untuk menyimpan file didalam folder htdocs. Simpan file dengan nama inputanpost.php.
Untuk melihat hasil dari file di atas dapat menggunakan browser Mozilla, google chrome, internet explorer atau jenis browser lain. Ketikkan pada address bar “LocalhostNama Folder Penyimpanan”,kemudian pilih file inputanpost.php

Ini baru inputpost.phpnya nah sekarang waktunya kita buat outputpost.php agar button proses dapat bekerja.

ketikan atau masukan coding berikut:

Output Post

Data Nama Yang Tadi Di Input Adalah :

Penjelasan coding:

sama seperti outputget,hanya disini jika method form yg digunakan post maka pemanggilannya pun harus beserta "_POST" dan diikuti dengan nama variabel yg dipanggil ["nama"]

Simpan file didalam folder yang sama dengan inputanget.php. Simpan file dengan nama outputput.php.