BLANTERWISDOM101

Tutorial HTML - Membuat Form di HTML

Tuesday, February 19, 2019

Form digunakan untuk menerima inputan dari user dan memproses hasil inputan tersebut ke server. Penggunakan form yang hanya menggunakan HTML saja tidak akan terlalu berguna. From biasanya hanya berupa interface yang disediakan untuk mengumpulkan data dari user, dan akan diproses dengan bahasa pemograman seperti JavaScript atau PHP, dan disimpan di dalam database MySQL

Cara Membuat Form Login

Berikut ini kodenya:
  1. <!DOCTYPE html>
  2. <html>
  3. <head><title>Form Login</title></head>
  4. <body>
  5. <form action="login.php" method="POST">
  6. <fieldset> <legend>Login</legend>
  7. <p><label>Username:</label><input type="text" name="username" placeholder="Username" /></p>
  8. <p><label>Password:</label><input type="password" name="password" placeholder="Password" /></p>
  9. <p><input type="submit" name="submit" value="Login" /></p></fieldset>
  10. </form>
  11. </body>
  12. </html>
See the Pen
WPmepP
by SuiteZploit (@suitezploit)
on CodePen.



Cara Membuat Form Contact

Silahakan ikuti kode berikut ini:
  1. <!DOCTYPE html>
  2. <html>
  3. <head><title>Contact Us</title> </head>
  4. <body>
  5. <form action="contact.php" method="POST">
  6. <fieldset><legend>Contact</legend>
  7. <p><label>Nama:</label><input type="text" name="name" placeholder="Nama" /> </p>
  8. <p><label>Subjek:</label><input type="box" name="subject" placeholder="Subjek" /> </p>
  9. <p><label>Email:</label><input type="email" name="email" placeholder="Email" /> </p>
  10. <p><input type="submit" name="submit" value="Send" /> </p></fieldset>
  11. </form>
  12. </body>
  13. </html>
See the Pen
XOGrLM
by SuiteZploit (@suitezploit)
on CodePen.

Pada kode diatas kita memberikan type="email" untuk field email, agar filed ini harus diisi dengan email saja. Jika tidak akan error.
Share This :