Pemrograman Web Formulir dalam HTML dan PHP I n W a h y u W i d o d o e m a i l @ r i n g k e s. c o m
Form Dalam sebuah website dinamis biasanya kita menemukan formulir baik itu untuk proses administrasi web ataupun interaksi dengan user. Administrasi website yang biasanya di pegang oleh satu atau beberapa orang web master yang harus lah secure (aman). Untuk proses pengamanan ini diperlukan suatu hak (authentifikasi). Suatu hal yang pertama kali dilakukan untuk memfilter seseorang memiliki hak akses atau tidak adalah login form. Jadi formulir ini adalah gerbang utama keluar masukknya suatu informasi kedalam website. Begitu pula informasi yang dikumpukan dari user juga di kumpulkan melalui sebuah atau lebih halaman form. Form dapat dibuat di sebuah html ataupun di flash atau di bahasa server sepeti php,asp,java,couldfusion dan lain-lain. Bagaimana penggunaan form? mari kita pelajari lebih lanjut. Penulisan tag form: <form> </form> Sebuah form ibarat sebuah tempat yang menampung satu atau lebih data yang akan diolah di file lain atau file itu sendiri. Pengolah data dari satu atau lebih form biasanya adalah file yang dibuat dari bahasa server. Sebuah form memiliki beberapa attribut yang harus ada, antara lain: A. Action Action merupakan attribut elemen form yang digunakan untuk mengarahkan tujuan pengiriman form. Misalkan formulir akan dikirimkan ke file proses.php maka penulisannya di tag nya sebagai berikut: <form action= proses.php > </form> B. Method Method merupakan attribut elemen form yang digunakan untuk menunjukkan bagaimana cara formulir dikirim. Ada dua method bagaimana sebuah formulir dikirim yaitu post dan get. Metode pengiriman ini akan berpengaruh terhadap bagaimana data dalam form dikirim dan juga diterima. Bila sebuah form dikirim dengan method post maka penerimaan di file pemroses juga dengan post begitu pula dengan pengiriman get pemroses menerima data juga dengan get. Atau pemroses juga dapat menerima kedua tipe pengiriman ini dengan request.
GET GET Form REQUEST GET Gambar 1.1 Proses Pengiriman Data : Permintaan data dari sumber tertentu : Data Serahkan untuk diproses ke sumber daya yang ditentukan Script Penerima Data: Data diterima berdasarkan attribut name dalam input elemen: <?php echo $_GET["name"];?> <?php echo $_["name"];?> GET vs Baik GET dan membuat sebuah array (e.g. array( key => value, key2 => value2, key3 => value3,...)). Setiap array ini mempunyai nama array dan isi key/value pairs, dan nama array masing-masing array adalah nama dari form controls dan isinya adalah input data dari user. Masing-masing $_GET dan $_ adalah superglobal variabel, artinya dapat diakses dimanapun dalam struktur fungsi atau class dalam OOP tanpa menambahkan sesuatu yang spesial. $_GET adalah sebuah variabel array yang dilewatkan melalui URL parameters. $_ adalah sebuah variabel array yang dilewatkan melalui jalur atau metode HTTP. Kapan Menggunakan GET? Get dikirim melalui sebuah form dengan metode get dimana variabel nya visible to everyone (all variable names and values are displayed in the URL). GET juga mempunyai limit dalam pengiriman datanya yaitu sekitar 2000 characters. Walaupun terlihat di URL variabel get masih
sering digunakan untuk keperluan tertentu yang berguna. Penggunaan get disarankan untuk tidak mengirim data sensitif. Note: GET should NEVER be used for sending passwords or other sensitive information! Kapan Menggunakan? Informasi yang dikirim dari formulir menggunakan metode bersifat invisible to others (all names/values are embedded within the body of the HTTP request) dan tidak ada limit no limits pada jumlah informasi yang dikirim. Daftar elemen dalam Form Element Related DOM interface Description <button> HTMLButtonElement Tombol yang dapat di klik. <datalist> HTMLDataListElement The datalist element contains a set of <option> elements that represent the possible options for the value of other form elements. <fieldset> HTMLFieldSetElement The fieldset is used to group several form elements within a form. <form> HTMLFormElement The form element represents a section of document that contains interactive element that enables a user to submit information to a web server. <input> HTMLInputElement The input element is used to create interactive controls for forms. <keygen> HTMLKeygenElement The keygen element exists to facilitate generation of key material, and submission of the public key as part of an HTML form <label> HTMLLabelElement The label element represents a caption for an item in a user interface
Element Related DOM interface Description <legend> HTMLLegendElement The legend element represents a caption for the content of its parent <fieldset>. <meter> HTMLMeterElement The meter element represents either a scalar value within a known range or a fractional value. <optgroup> HTMLOptGroupElement the optgroup element creates a group of options within a <select> element. <option> HTMLOptionElement the HTML option element is used to create a control representing an item within a <select>, an <optgroup> or a <datalist> element. <output> HTMLOutputElement The output element represents the result of a calculation. <progress> HTMLProgressElement The progress element is used to view the completion progress of a task. <select> HTMLSelectElement The select element represents a control that presents a menu of options. <textarea> HTMLTextAreaElement The textarea element represents a multi-line plain-text editing control.