API tools faq
paste
Advertisement
rezamalik15

contoh html form

rezamalik15
Jun 6th, 2023 (edited)
731
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 5.35 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3.   <head>
  4.     <meta charset="utf-8">
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.     <title>HTML - Form</title>
  7.     <meta name="description" content="">
  8.     <meta name="viewport" content="width=device-width, initial-scale=1">
  9.   </head>
  10.   <body>
  11.  
  12.     <h1>Formulir Pendaftaran</h1>
  13.  
  14.     <form action="" method="post">
  15.      
  16.       <fieldset>
  17.         <legend>Biodata Diri</legend>
  18.  
  19.         <p>Masukkan data di bawah ini dengan benar!</p>
  20.  
  21.         <table>
  22.  
  23.           <tr>
  24.             <td>
  25.               <label for="fname">Nama Depan</label>
  26.             </td>
  27.             <td>
  28.               <input type="text" name="fname" id="fname">
  29.             </td>
  30.           </tr>
  31.  
  32.           <tr>
  33.             <td>
  34.               <label for="lname">Nama Belakang</label>
  35.             </td>
  36.             <td>
  37.               <input type="text" name="lname" id="lname">
  38.             </td>
  39.           </tr>
  40.  
  41.           <tr>
  42.             <td>
  43.               <label>Jenis Kelamin</label>
  44.             </td>
  45.             <td>
  46.               <input type="radio" name="jk" id="laki" value="laki">
  47.               <label for="laki">Laki-laki</label>
  48.  
  49.               <br>
  50.  
  51.               <input type="radio" name="jk" id="perempuan" value="perempuan">
  52.               <label for="perempuan">Perempuan</label>
  53.             </td>
  54.           </tr>
  55.  
  56.           <tr>
  57.             <td>
  58.               <label for="pob">Tempat Lahir</label>
  59.             </td>
  60.             <td>
  61.               <input type="text" name="pob" id="pob">
  62.             </td>
  63.           </tr>
  64.  
  65.           <tr>
  66.             <td>
  67.               <label for="dob">Tanggal Lahir</label>
  68.             </td>
  69.             <td>
  70.               <input type="date" name="dob" id="dob">
  71.             </td>
  72.           </tr>
  73.  
  74.         </table>
  75.  
  76.       </fieldset>
  77.  
  78.       <br>
  79.  
  80.       <fieldset>
  81.         <legend>Alamat Lengkap</legend>
  82.  
  83.         <table>
  84.  
  85.           <tr>
  86.             <td>
  87.               <label for="provinsi">Provinsi</label>
  88.             </td>
  89.             <td>
  90.               <select name="provinsi" id="provinsi">
  91.                 <option value="0">-Pilih Provinsi-</option>
  92.                 <option value="1">DKI Jakarta</option>
  93.                 <option value="2">Jawa Barat</option>
  94.                 <option value="3">Banten</option>
  95.                 <option value="4">Jawa Tengah</option>
  96.               </select>
  97.             </td>
  98.           </tr>
  99.  
  100.           <tr>
  101.             <td>
  102.               <label for="kota">Kota</label>
  103.             </td>
  104.             <td>
  105.               <select name="kota" id="kota">
  106.                 <option value="0">-Pilih Kota-</option>
  107.                 <option value="1">Jakarta Utara</option>
  108.                 <option value="2">Jakarta Pusat</option>
  109.                 <option value="3">Jakarta Barat</option>
  110.                 <option value="4">Jakarta Timur</option>
  111.                 <option value="5">Jakarta Selatan</option>
  112.               </select>
  113.             </td>
  114.           </tr>
  115.  
  116.           <tr>
  117.             <td>
  118.               <label for="kecamatan">Kecamatan</label>
  119.             </td>
  120.             <td>
  121.               <select name="kecamatan" id="kecamatan">
  122.                 <option value="0">-Pilih Kecamatan-</option>
  123.               </select>
  124.             </td>
  125.           </tr>
  126.  
  127.           <tr>
  128.             <td>
  129.               <label for="kelurahan">Desa / Kelurahan</label>
  130.             </td>
  131.             <td>
  132.               <select name="kelurahan" id="kelurahan">
  133.                 <option value="0">-Pilih Desa / Kelurahan-</option>
  134.               </select>
  135.             </td>
  136.           </tr>
  137.  
  138.           <tr>
  139.             <td>
  140.               <label for="alamat">Alamat</label>
  141.             </td>
  142.             <td>
  143.               <textarea name="alamat" id="alamat" cols="25" rows="10"></textarea>
  144.             </td>
  145.           </tr>
  146.  
  147.         </table>
  148.       </fieldset>
  149.  
  150.       <br>
  151.  
  152.       <fieldset>
  153.         <legend>Akun</legend>
  154.  
  155.         <table>
  156.  
  157.           <tr>
  158.             <td>
  159.               <label for="email">Email</label>
  160.             </td>
  161.             <td>
  162.               <input type="email" id="email" name="email">
  163.             </td>
  164.           </tr>
  165.  
  166.           <tr>
  167.             <td>
  168.               <label for="username">Username</label>
  169.             </td>
  170.             <td>
  171.               <input type="text" id="username" name="username" maxlength="10">
  172.             </td>
  173.           </tr>
  174.          
  175.           <tr>
  176.             <td>
  177.               <label for="pass1">Password</label>
  178.             </td>
  179.             <td>
  180.               <input type="password" id="pass1" name="pass1">
  181.             </td>
  182.           </tr>
  183.  
  184.           <tr>
  185.             <td>
  186.               <label for="pass2">Konfirmasi Password</label>
  187.             </td>
  188.             <td>
  189.               <input type="password" id="pass2" name="pass2">
  190.             </td>
  191.           </tr>
  192.          
  193.         </table>
  194.  
  195.       </fieldset>
  196.  
  197.       <br>
  198.  
  199.       <fieldset>
  200.         <legend>Syarat dan ketentuan</legend>
  201.  
  202.         <p>Dengan memilih "Setuju", anda sudah mengikuti <a href="#">Syarat dan ketentuan</a>yang berlaku</p>
  203.  
  204.         <input type="checkbox" name="setuju" id="setuju">
  205.         <label for="setuju">Setuju</label>
  206.  
  207.         <br><br>
  208.  
  209.         <input type="submit" value="Daftar"> <input type="reset" value="Reset">
  210.       </fieldset>
  211.  
  212.     </form>
  213.  
  214.   </body>
  215. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!