Contoh11 (Form)

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 <FORM> dan ditutup dengan tag </FORM>. Di dalam tag pembuka <FORM> 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:
<html>
<head>
    <title>Contoh 11 FORM METODE GET</title>
</head>
<body>
<form action="metodegetproses.php" method="get">
Masukkan nama : <input type="text" name="nama" size="25">
<input type="submit" value="Proses">
</form>
</body>
</html>

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 : <input type="text" name"=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
  1. Simpan file di atas di dalam folder c:\XAMPP\htdocs\ '(jgn lupa instal dan run xampp)' buat folder baru untuk menyimpan file didalam folder htdocs. Simpan file dengan nama inputanget.php.
  2. Untuk melihat hasil dari file di atas dapat menggunakan browser Mozilla, google chrome, internet explorer atau jenis browser lain. Ketikkan pada address bar “Localhost\Nama 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:
 <html>
<head>
    <title>Output Get</title>
</head>
<body>
Data Nama Yang Tadi Di Input Adalah : <?php echo $_GET["nama"];?>
</form>
</body>
</html>


Penjelasan Coding :
<?php echo $_GET["nama"];?> ; karna form inputannya menggunakan method get maka untuk menampilkannya pun haru dengan "_GET" lalu  diikuti dengan variabel namenya ["nama']
  1. 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:
<html>
<head>
    <title>Form Metode Post</title>
</head>
<body>
<form action="outputpost.php" method="post">
Masukkan nama : <input type="text" name="nama" size="25">
<input type="submit" value="Proses">
</form>
</body>
</html>

Penjelasan coding :
sama seperti penjelasan pada metode get hanya ini diganti methode ="post".
dan form action="outputpost.php"
  1. Simpan file di atas di dalam folder c:\XAMPP\htdocs\ '(jgn lupa instal dan run xampp)' buat folder baru untuk menyimpan file didalam folder htdocs. Simpan file dengan nama inputanpost.php.
  2. Untuk melihat hasil dari file di atas dapat menggunakan browser Mozilla, google chrome, internet explorer atau jenis browser lain. Ketikkan pada address bar “Localhost\Nama 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:
<html>
<head>
    <title>Output Post</title>
</head>
<body>
Data Nama Yang Tadi Di Input Adalah : <?php echo $_POST["nama"];?>
</form>
</body>
</html>

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.




Dengan menggunakan method post nilai dari suatu variabelnya tidak terlihat berbeda dengan method get yang terlihat..


Jika ada pertanyaan silakan berkomentar :)

Berlangganan update artikel terbaru via email:

9 Responses to "Contoh11 (Form)"

anggara said...

mantep nih izin coba

Fajar Yusuf said...

Silakan gan

rakaunpo said...

mantep gan

Zidan Zulkarnain Ramadhan said...

mantaap ajibb (y)

Ujwar Firdaus said...

keren lah pembahasannnya.. makasih gan

Ahmad Laturangga said...

keren nih. ane izin pelajarin lagi yah gan

Fajar Yusuf said...

silakan gan

Fajar Yusuf said...

sama sama gan

Fajar Yusuf said...

(y)makasih gan

TENTANG SITUS

SITUS INI ADALAH SITUS INFO GAME TERBARU DAN JUGA SITUS PEMBELAJARAN PEMROGRAMAN DAN JUGA PEMAHAMAN TERHADAP TEKNOLOGI KOMPUTER. KALIAN BISA MENGIKUTI PEMBELAJARAN PEMROGRAMAN DENGAN BERTAHAP PADA MATERI YANG SUDAH SAYA SEDIAKAN, JIKA ADA MATERI YANG MEMBINGUNGKAN SILAKAN LAKUKAN KOMENTAR PADA MATERI YANG ANDA TANYAKAN ATAU KALIAN BISA MENGHUBUNGI SAYA DIHALAMAN KONTAK.

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel