Cara membuat formulir di php

Seberapa mudah atau sulit?. Saya pikir itu hanya sulit sekali, setelah membaca ini saya yakin Anda akan senang dan Anda akan merasa bahwa "Saya akan menjadi programmer top di piala dunia". Demikian tutorial cara membuat Add More/Add Dynamic Input Form dengan php dan MySQL, semoga dapat membantu anda yang membutuhkan. Kurang lebihnya saya mohon maaf, jika ada pertanyaan, kritik dan saran silahkan tinggalkan di kolom komentar dibawah. Selamat Coding dan ikuti terus tutorial-tutorial seru lainnya. )

Saat membuat situs web atau aplikasi berbasis web, kita tidak dapat melakukannya tanpa apa yang disebut formulir. Form ini digunakan untuk menerima input dari user untuk diproses sesuai kebutuhan

Seperti yang kita ketahui, form HTML hanya digunakan untuk (1) menerima input dari pengguna dan (2)  kirim data ke alamat tertentu, selesai ya sampai disitu fungsi dari form HTML ini, tentang bagaimana data diproses bukan tanggung jawab formulir lagi.

I. Elemen Formulir HTML

Elemen form <form..> memiliki beberapa atribut penting yang akan menentukan kemana data dikirim dan bagaimana data dikirim, atribut tersebut adalah action dan method, misalnya kita membuat file

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

Masukkan kode berikut ke dalam formulir file. php

<h1>Form HTML Dengan PHP</h1>
<form action="proses.php" method="post">
	<div>
		<label>Nama</label><input type="text" name="nama"/>
	</div>
	<div>
		<label>Email</label><input type="text" name="email"/>
	</div>
	<input type="submit" value="Simpan"/>
</form>

DEMO

Klik DEMO untuk langsung melihat hasilnya

1  Tindakan Atribut

Atribut tindakan berisi alamat url tempat data formulir akan dikirim. Pada contoh script di atas, atribut action kita isi dengan

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

URL Relatif VS URL Absolut

Jika alamat url (disertakan dalam atribut tindakan pada formulir) ditulis tanpa menggunakan

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

Misalnya, pada contoh di atas, atribut tindakan pada elemen

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

<?php
echo 'Nama  : ' . $_GET['nama'] . '<br/>';
echo 'Email : ' . $_GET['email'];

Jadi, karena file

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

<?php
echo 'Nama  : ' . $_GET['nama'] . '<br/>';
echo 'Email : ' . $_GET['email'];

Jika atribut tindakan kita diisi

<?php
echo 'Nama  : ' . $_GET['nama'] . '<br/>';
echo 'Email : ' . $_GET['email'];

<?php
echo 'Nama  : ' . $_GET['nama'] . '<br/>';
echo 'Email : ' . $_GET['email'];

Selain relative url kita juga bisa mengisi atribut action dengan absolute url, absolute url artinya alamat url ditulis lengkap. misalnya

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

2 Atribut Metode

Atribut metode digunakan untuk menentukan bagaimana data dikirim. Atribut ini memiliki dua nilai yaitu GET dan POST

Metode DAPATKAN

Pada metode GET, data pada form akan dikirimkan melalui url. Misal pada form yang sudah kita buat sebelumnya, kita beri atribut method dengan nilai

<?php
echo 'Nama  : ' . $_GET['nama'] . '<br/>';
echo 'Email : ' . $_GET['email'];

Pada gambar terlihat alamat url berubah menjadi

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

Pada url di atas, bagian parameter yang berisi data formulir diawali dengan tanda tanya, diikuti dengan parameter dengan format  

echo '<pre>'; print_r($_GET);
/* Hasil: 
Array
(
 [nama] => Agus Prawoto Hadi
 [email] => [email protected]
 [submit] => Simpan
)
*/

echo '<pre>'; print_r($_GET);
/* Hasil: 
Array
(
 [nama] => Agus Prawoto Hadi
 [email] => [email protected]
 [submit] => Simpan
)
*/

Pada gambar diatas terlihat bahwa

echo '<pre>'; print_r($_GET);
/* Hasil: 
Array
(
 [nama] => Agus Prawoto Hadi
 [email] => [email protected]
 [submit] => Simpan
)
*/

echo '<pre>'; print_r($_GET);
/* Hasil: 
Array
(
 [nama] => Agus Prawoto Hadi
 [email] => [email protected]
 [submit] => Simpan
)
*/

echo '<pre>'; print_r($_GET);
/* Hasil: 
Array
(
 [nama] => Agus Prawoto Hadi
 [email] => [email protected]
 [submit] => Simpan
)
*/

echo '<pre>'; print_r($_GET);
/* Hasil: 
Array
(
 [nama] => Agus Prawoto Hadi
 [email] => [email protected]
 [submit] => Simpan
)
*/

Pada URL Encode beberapa karakter akan diubah dengan karakter tertentu, namun tidak perlu khawatir, saat data diambil dengan PHP, data tersebut akan didekodekan, sehingga kembali ke bentuk aslinya.

echo '<pre>'; print_r($_GET);
/* Hasil: 
Array
(
 [nama] => Agus Prawoto Hadi
 [email] => [email protected]
 [submit] => Simpan
)
*/

echo '<pre>'; print_r($_GET);
/* Hasil: 
Array
(
 [nama] => Agus Prawoto Hadi
 [email] => [email protected]
 [submit] => Simpan
)
*/

echo '<pre>'; print_r($_GET);
/* Hasil: 
Array
(
 [nama] => Agus Prawoto Hadi
 [email] => [email protected]
 [submit] => Simpan
)
*/

Metode POST

Pada metode POST,  data pada form akan dikirim melalui http request header, sehingga tidak terlihat oleh user. Misal pada form sebelumnya kita isikan atribut action dengan nilai POST, kemudian pada saat kita klik simpan maka alamat URL akan berubah menjadi.

Pada gambar di atas terlihat bahwa tidak ada data yang dikirimkan melalui URL. Jika kita ingin melihat data terkirim, kita bisa menggunakan addon developer tools di Chrome atau firebug di Firefox, lalu pilih bagian tab Network

Metode GET vs Metode POST

Metode GET dan POST memiliki beberapa perbedaan mendasar, diantaranya

Metode DAPATKAN

• Kurang aman karena data terekspos, selain itu karena dikirim via url maka data akan tersimpan di history browser
• Panjang data dibatasi antara 2kb - 8kb tergantung pada jenis browser
• Hanya bisa mengirim data teks, tidak bisa mengirim file
• Karena browser tidak diperlakukan sebagai data sensitif, sehingga halaman dapat di-refresh dengan mudah

metode POST

• Lebih aman, karena data tidak terekspos, selain itu data yang dikirim tidak tersimpan di history browser
• Dapat mengirim data besar
• Dapat mengirim berbagai jenis data termasuk file
• Karena browser diperlakukan sebagai data sensitif, maka saat di-refresh, browser akan meminta konfirmasi pengiriman ulang data

Lebih lanjut tentang kedua metode ini, termasuk kelebihan dan kekurangan, kapan menggunakannya, dan proses pengiriman dibahas secara lengkap di.  Memahami GET dan POST Dalam PHP dan HTTP

II. Menangkap Data Dari Bentuk HTML Dengan PHP

Setelah data dikirim melalui form HTML, maka data siap untuk diproses

Menangkap DAPATKAN Data

Untuk menangkap data yang dikirim dengan metode GET, kita menggunakan variabel

echo '<pre>'; print_r($_GET);
/* Hasil: 
Array
(
 [nama] => Agus Prawoto Hadi
 [email] => [email protected]
 [submit] => Simpan
)
*/

echo '<pre>'; print_r($_GET);
/* Hasil: 
Array
(
 [nama] => Agus Prawoto Hadi
 [email] => [email protected]
 [submit] => Simpan
)
*/

Sebagai contoh. isi file

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

<?php
echo 'Nama  : ' . $_GET['nama'] . '<br/>';
echo 'Email : ' . $_GET['email'];

Selanjutnya ubah atribut action pada file

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

http://localhost/form/proses.php?nama=JagoWebDev&[email protected]

Untuk melihat semua data yang dikirim, gunakan fungsi

http://localhost/form/proses.php?nama=JagoWebDev&[email protected]

echo '<pre>'; print_r($_GET);
/* Hasil: 
Array
(
 [nama] => Agus Prawoto Hadi
 [email] => [email protected]
 [submit] => Simpan
)
*/

Karena data dikirim melalui URL, maka kita dapat mengubah data tersebut dengan mengubah URL, misalnya mengubah URL menjadi

http://localhost/form/proses.php?nama=JagoWebDev&[email protected]

maka hasil yang kita dapatkan

Menangkap Data POST

Sedangkan untuk metode

http://localhost/form/proses.php?nama=JagoWebDev&[email protected]

http://localhost/form/proses.php?nama=JagoWebDev&[email protected]

echo '<pre>'; print_r($_GET);
/* Hasil: 
Array
(
 [nama] => Agus Prawoto Hadi
 [email] => [email protected]
 [submit] => Simpan
)
*/

http://localhost/form/proses.php?nama=JagoWebDev&[email protected]

echo '<pre>'; print_r($_GET);
/* Hasil: 
Array
(
 [nama] => Agus Prawoto Hadi
 [email] => [email protected]
 [submit] => Simpan
)
*/

Misalnya kita mengubah nilai atribut action pada elemen form menjadi post, kemudian isi file

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

<?php
echo 'Nama  : ' . $_POST['nama'] . '<br/>';
echo 'Email : ' . $_POST['email'];
echo '<pre>'; print_r($_POST);

Ketika kita klik tombol submit, hasil yang kita dapatkan adalah

AKU AKU AKU. Mengirim dan Menangkap Data Dengan File Yang Sama

Sejauh ini, kami mengirim dan menangkap data dalam dua file berbeda, yaitu

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

http://localhost/form/proses.php?nama=Agus+Prawoto+Hadi&email=prawoto.hadi%40gmail.com

Dalam prakteknya, untuk mengirim dan menangkap data kita sering menggunakan file yang sama, sehingga lebih praktis. Untuk mengirim dan mengambil data formulir dengan file yang sama caranya, kosongkan nilai pada atribut action, misalnya

<?php
echo 'Nama  : ' . $_POST['nama'] . '<br/>';
echo 'Email : ' . $_POST['email'];
echo '<pre>'; print_r($_POST);

Misalnya pada folder form, kita buat file

<?php
echo 'Nama  : ' . $_POST['nama'] . '<br/>';
echo 'Email : ' . $_POST['email'];
echo '<pre>'; print_r($_POST);

<h1>Form HTML Dengan PHP</h1>
<form action="" method="get">
	<div>
		<label>Nama</label><input type="text" name="nama" value="<?=isset($_POST['nama']) ? $_POST['nama'] : ''?>"/>
	</div>
	<div>
		<label>Email</label><input type="text" name="email" value="<?=isset($_POST['email']) ? $_POST['email'] : ''?>"/>
	</div>
	<input type="submit" name="submit" value="Simpan"/>
</form>
<?php
if (isset($_POST['submit'])) {
	echo 'Nama Anda  : ' . $_POST['nama'] . '<br/>';
	echo 'Email Anda : ' . $_POST['email'];
}?>

DEMO

Penjelasan

• Pada baris 4, kita membuat ternary operator

  <?php
  echo 'Nama  : ' . $_POST['nama'] . '<br/>';
  echo 'Email : ' . $_POST['email'];
  echo '<pre>'; print_r($_POST);

  5 jika anda klik submit, pernyataan ini akan mencetak nama yang telah dimasukkan pengguna, hal yang sama terjadi pada email (baris 7)
• Selanjutnya pada baris 12 kita test apakah variabel post memiliki indeks

  <?php
  echo 'Nama  : ' . $_POST['nama'] . '<br/>';
  echo 'Email : ' . $_POST['email'];
  echo '<pre>'; print_r($_POST);

  6, jika iya berarti ada data yang terkirim, lalu kita print nama dan email yang diinput user

IV. Menampilkan Hasil Input Form HTML dengan PHP

Ada berbagai jenis elemen untuk mengirim data menggunakan Formulir HTML, antara lain elemen

<?php
echo 'Nama  : ' . $_POST['nama'] . '<br/>';
echo 'Email : ' . $_POST['email'];
echo '<pre>'; print_r($_POST);

<?php
echo 'Nama  : ' . $_POST['nama'] . '<br/>';
echo 'Email : ' . $_POST['email'];
echo '<pre>'; print_r($_POST);

<?php
echo 'Nama  : ' . $_POST['nama'] . '<br/>';
echo 'Email : ' . $_POST['email'];
echo '<pre>'; print_r($_POST);

Elemen masukan memiliki beberapa jenis, antara lain

<h1>Form HTML Dengan PHP</h1>
<form action="" method="get">
	<div>
		<label>Nama</label><input type="text" name="nama" value="<?=isset($_POST['nama']) ? $_POST['nama'] : ''?>"/>
	</div>
	<div>
		<label>Email</label><input type="text" name="email" value="<?=isset($_POST['email']) ? $_POST['email'] : ''?>"/>
	</div>
	<input type="submit" name="submit" value="Simpan"/>
</form>
<?php
if (isset($_POST['submit'])) {
	echo 'Nama Anda  : ' . $_POST['nama'] . '<br/>';
	echo 'Email Anda : ' . $_POST['email'];
}?>

<h1>Form HTML Dengan PHP</h1>
<form action="" method="get">
	<div>
		<label>Nama</label><input type="text" name="nama" value="<?=isset($_POST['nama']) ? $_POST['nama'] : ''?>"/>
	</div>
	<div>
		<label>Email</label><input type="text" name="email" value="<?=isset($_POST['email']) ? $_POST['email'] : ''?>"/>
	</div>
	<input type="submit" name="submit" value="Simpan"/>
</form>
<?php
if (isset($_POST['submit'])) {
	echo 'Nama Anda  : ' . $_POST['nama'] . '<br/>';
	echo 'Email Anda : ' . $_POST['email'];
}?>

<h1>Form HTML Dengan PHP</h1>
<form action="" method="get">
	<div>
		<label>Nama</label><input type="text" name="nama" value="<?=isset($_POST['nama']) ? $_POST['nama'] : ''?>"/>
	</div>
	<div>
		<label>Email</label><input type="text" name="email" value="<?=isset($_POST['email']) ? $_POST['email'] : ''?>"/>
	</div>
	<input type="submit" name="submit" value="Simpan"/>
</form>
<?php
if (isset($_POST['submit'])) {
	echo 'Nama Anda  : ' . $_POST['nama'] . '<br/>';
	echo 'Email Anda : ' . $_POST['email'];
}?>

Agar pembahasannya tidak terlalu panjang, tutorial cara menampilkan hasil input form HTML dengan PHP bisa diikuti di artikel

Pada artikel selanjutnya kita akan membahas cara membuat form dan penanganan data POST. Output yang dihasilkan adalah seperti yang ditunjukkan pada gambar berikut

Pada gambar di atas

• Saat dikirimkan, elemen masukan akan tetap berisi data yang telah dimasukkan , dipilih , dan diperiksa oleh pengguna.
• Kami menguji apakah elemen input khususnya elemen checkbox dicentang atau tidak, karena untuk mengetahui apakah kotak centang dicentang atau tidak, teknik pengujiannya cukup berbeda.

Bentuk demo. Bentuk HTML Dalam PHP

Unduh Kode Sumber. Lihat Kode Sumber

Demikian pembahasan cara menghubungkan form HTML dengan PHP, semoga bermanfaat

Lebih lanjut tentang GET dan POST.  Memahami GET dan POST dan HTTP

Berlangganan sekarang

Suka artikel di Jagowebdev. com? . com

Komitmen kita. Kami selalu menghargai privasi Anda dan tidak akan membagikan identitas Anda kepada pihak mana pun

Langkah demi langkah untuk membuat formulir login HTML?

Bagaimana cara mengambil data dari formulir yang menggunakan metode GET?

Apa itu form dalam HTML?

Apa itu form dalam pemrograman?