Reset Form Dengan HTML DOM

Pada tutorial kali ini anda akan belajar bagaimana cara Reset Form Dengan HTML DOM .

Pada suatu waktu dalam belajar tentang membangun sebuah website entah itu statis atau web dinamis(dynamic web) kita akan belajar mengenai form, suatu website walaupun tidak semua , secara mayoritas pasti menggunakan form pada bagian tertentu dari website mereka entah untuk insert data, pencarian data atau untuk comment.

Sebenarnya ada cara untuk reset form dengan menggunakan <input type=”reset”> , tetapi kali ini saya akan mengajarkan reset form dengan menggunakan HTML DOM. so check this out :

HTML DOM //

<!DOCTYPE html>
<html>
<body>

<p>Enter some text in the fields below, then press the "Reset form" button to reset the form.</p>

<form id="myForm">
  First name: <input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br><br>
  <input type="button" onclick="myFunction()" value="Reset form">
</form>

<script>
function myFunction() {
    document.getElementById("myForm").reset();
}
</script>

</body>
</html>

Hasilnya akan seperti ini :

Silahkan isi form di atas kemudian tekan button reset , maka nilai yang di inputkan akan hilang dan bersih seperti awalnya.

Ok semoga bermanfaat , dan sampai bertemu lagi pada artikel selanjutnya

Kategori