Cara Membuat Tampilan Form Pendaftaran Input Data HTML Sederhana

Untuk dapat login pada sebuah website biasanya diberikan sebuah form pendaftaran untuk menginputkan data user ke dalam sistem, yang nantinya akan disimpan ke dalam databse sistem. 

Tampilan form website dapat berupa popup atau sebuah halaman, kalau teman - teman lebih memilih tampilan popup atau halaman ?

Kali ini saya akan mengajak teman - teman untuk mengetahui bagaimana cara membuat sebuah form pendaftaran untuk input data user, tampilannya bukan popup ya? 

Kali ini saya ingin memberikan tampilan yang simple/sederhana ya sangat sederhana. Namun walaupun sederhana menurut pengalaman saya hal yang sederhana itu sangat penting untuk menggapai sesuatu yang lebih besar.

Berikut Kode HTML Sederhana untuk membuat Form Input Data

<h1>Dashboard Ga Punya Kode</h1>
<ul>
<li>
<a class="active" href="#home">Home</a>
</li>
<li class="dropdown">
<a class="dropbutton" href="#">DropdownMenu</a>
<label class="dropdown-content">
<a href="#">Menu 1</a>
    <a href="#">Menu 2</a>
    <a href="#">Menu 3</a>
</label>
</li>

<li class="form-login">
<form action="">
<label>Username:</label>
<input type="text" name="username">

<label>Password:</label>
<input type="text" name="password">

<input type="submit" value="LogIn">
</form>
</li>
</ul>

<img src="#" alt=" " width="100%" height="350px">
<a href="https://www.androitechnoku.blogspot.com"> androitechnoku</a>
<h2>Form Input Data</h2>

<form action=" ">
<label>Username :</label><br>
<input type="text" name="username">
<br><br>
<label>Nama Lengkap:</label><br>
<input type="text" name="namalengkap">
<br><br>
<label>Password:</label><br>
<input type="text" name="password">
<br><br>
<label>Alamat:</label><br>
<textarea type="text" name="alamat" rows="4" cols="50"></textarea>
<br><br>
<label>Agama:</label>
<select name="agama">
        <option value="islam">Islam</option>
        <option value="kristen">Kristen</option>
        <option value="hindu">Hindu</option>
        <option value="budha">Budha</option>
        <option value="katholik">Katholik</option>
  </select>
  <br><br>
<label>Jenis Kelamin:</label>
<input type="checkbox" name="jk1" value="lakilaki"> Laki-Laki
  <input type="checkbox" name="jk2" value="perempuan"> Perempuan
  <br><br>
<input type="submit" value="Kirim">
</form>

Tag form menjadi peran penting untuk membuat sebuah form inputan, di dalam tag <form> terdapat inputan tag select, tampilannya semacam bentuk dropdown dan value atau pilihannya sudah ada secara otomatis, namun jika sudah dikaitkan dengan database kita dapat menggunakan fungsi php untuk mengambil data yang telah tersedia di dalam database.

Saya sendiri masih bingung sob, jika kita kita menuliskan data seperti data agama yang mungkin sudah dipastikan jumlahnya, apa perlu kita memasukan ke dalam database atau kita tuliskan langsung di dalam kodenya ?

Menurut teman - teman ringan ditulis di kode apa ringan saat nge-load data dari database ?

Berikut kode Cssnya

form {
margin-left: 45px;
}
h2 {
margin-left: 45px;
}

Kode margin berfungsi memberikan jarak, memberikan margin pada sebuah bagian tertentu dimaksudkan untuk menampilkan design tata letak sesuai keinginan kita, seperting padding hampir mirip-mirip tapi tetap berbeda hhehe.

Demikian cara membuat form pendaftaran menggunakan html sederhana. Semoga bermanfaat buat temen-temen Terima Kasih.

Share this post