"Type Form" dalam PHP

            Apa kabar kalian semuanya, hehe terimakasih lhooo udah mengikuti saya sampai saat, terimakasih banyak yah. Tanpa basa-basi lagi kita langsung bahas materi baruuu yuu supaya ilmu kita dapat bertambah. Ikuti saja terus yah, cekidot ...........


             Sekarang S-Evan melanjutkan kembali dengan jenis-jenis input type yang lain. Cukup banyak jumlahnya dengan fungsinya yang juga beragam. Sebagian besar sering kita jumpai pada format pengisian formulir online.

        Input Type Number

          Jenis input type ini digunakan untuk bidang input yang berisi nilai numerik. Seperti contoh berikut :

<p>
Berapa jumlah mantan pacar kamu sampai saat ini?
</p>
<br>
<form action="action_page.php">
  Jumlah :
  <input type="number" name="jumlah"  min="10" max="100" step="10" value="10">
  <input type="submit">
</form>

dan hasilnya akan menjadi:

Berapa jumlah mantan pacar kamu sampai saat ini?

Jumlah :

           Input Type Date

            Seperti namanya, date adalah tanggal. Maka fungsinya adalah untuk kebutuhan bidang input tanggal. Sering kita jumpai input type jenis ini untuk proses sign up yang memerlukan data tanggal lahir anggotanya. Seperti contoh berikut :

<form action="action.php">
<textarea name="message" rows="10" cols="50">
Tuliskan komentar di sini ...
</textarea>
<br>
Username:<br>
<input type="text" name="userid">
<br>
Password:<br>
<input type="password" name="psw">
<br><br>
<input type="submit" value="submit">
</form>

Hasilnya akan menjadi sebagai berikut

 

Tuliskan komentar di sini ...
Username:
Password:

             Input Type Checkbox

              Yang satu ini juga sering kita jumpai. Memberikan tanda centang pada beberapa pilihan. Hampir sama dengan input type radio yang pernah kita bahas sebelumnya. Hanya saja jika input type radio itu hanya satu opsi yang bisa dijadikan pilihan, sedangkan checkbox ini bisa memilih satu atau lebih dari sejumlah pilihan yang ada.
Seperti contoh berikut :

<p>
Di bawah ini adalah makanan favorit saya :
</p>
<br>
<form action="action.php">
<input type="checkbox" name="pet" value="kucing">Kucing
<br>
<input type="checkbox" name="pet" value="kelinci">Kelinci 
<br>
<input type="checkbox" name="pet" value="kucing">Ayam
<br>
<input type="checkbox" name="pet" value="kelinci">Burung 
<br>
<input type="checkbox" name="pet" value="kucing">Kampret
<br>
<input type="checkbox" name="pet" value="kelinci">Monyet 
<br><br>
<input type="submit">
</form>

 Hasilnya akan menjadi sebagai berikut:

Di bawah ini adalah makanan favorit saya :

Kucing
Kelinci
Ayam
Burung
Kampret
Monyet

           Input Type Button

Input type button ini semacam fungsi tombol yang jika diklik akan muncul alert. Bunyi alert nya tergantung kita mau mengisinya dengan kata-kata apa. Contohnya seperti di bawah ini :

<input type="button" onclick="alert('Ada Boooommm Brooo...!')" value="Klik di Sini!">

Hasilnya akan seperti berikut:

           Input Type datetime-local

              Jika sebelumnya ada input type date. Yang ini hampir sama, datetime-local. Hanya lebih komplit. Karena bukan cuma input tanggal, tapi juga input waktu. Jika hanya ingin menampilkan input waktu, maka pada bagian input type nya tinggal diganti dengan input type="time".

<form action="action.php">
  Tanggal dan Waktu :
  <input type="datetime-local" name="bdaytime">
  <input type="submit" value="Send">
</form>

Dan hasilnya akan sebagai berikut:

 Tanggal dan Waktu :

Cara Penggunaan Tag Input type text dan type password

         Sebagai penutup, saya akan membuat beberapa tag input untuk merangkum apa yang telah kita pelajari dalan tutorial kali ini, berikut cara penggunaan tag input type text dan type password dalam HTML:

   Tag Input dengan atribut value :

<input type="text" name="nama_user" value="masukkan nama anda"/>

<br/>

   Tag Input dengan atribut size = 4 :

<input type="text" name="nama_user" size="4"/>

<br/>

   Tag Input dengan atribut maxlength = 5 :

<input type="text" name="nama_user" maxlength="5" />

<br/>

   Tag Input dengan atribut readonly :

<input type="text" name="nama_user" readonly="readonly"/>

<br/>

   Tag Input dengan atribut disabled :

<input type="text" name="nama_user" disabled="disabled" />

<br/>

</form>

</body>

</html>

Dan hasilnya akan sebagai berikut:
Tag Input dengan atribut value :
Tag Input dengan atribut size = 4 :
Tag Input dengan atribut maxlength = 5 :
Tag Input dengan atribut readonly :  
Tag Input dengan atribut disabled :



Sumber Referensi:
Wikipedia

Browse More Articles

Tweet

Written by Unknown

We are Creative Blogger Theme Wavers which provides user friendly, effective and easy to use themes. Each support has free and providing HD support screen casting.