Cara menggunakan form submit javascript

❮ Form Object

Definition and Usage

The submit() method submits the form (same as clicking the Submit button).

Tip: Use the reset() method to reset the form.

Browser Support

The numbers in the table specify the first browser version that fully supports the method.

Syntax

Parameters

Return Value

Related Pages

HTML Tutorial: HTML Forms

JavaScript Tutorial: JS Forms/Validation

Niguru.com | Jumat, 2 Okt 2020 | Dalam penulisan program dengan menggunakan bahasa pemrograman Javascript terdapat pemisahan area Javascript dengan area HTML. Area Javascript dibatasi dengan tag awal /pembuka: <script>, dan tag akhir /penutup </script>.

 Pada posting kali ini Niguru.com akan menjelaskan mengenai cara mengirimkan dan menerima data diantara HTML dan Javascript. Dengan demikian komunikasi antara HTML dengan Javascript menjadi lebih mudah dibangun.

1. Buat <form> </form> sebagai area pembatas pada HTML.

2. Buat input object di dalam area form dan beri ID

3. Kirim dengan argumen atau parameter: this form.

4. Pada Javascript buat function dengan argumen: obj.

Dengan 4 cara di atas maka setiap input object yang ada di dalam area form pada HTML akan dikenali oleh Javascript.

Kenapa saya buat judul seperti ini, ya karena disini kadang kita suka lupa, kadang saya sendiri juga suka lupa kapan kita bisa menggunakan onsubmit dan kapan juga kita bisa menggunakan event click, jika di lihat keduanya hampir sama ya, jadi perbedaanya terletak pada event yang tepat jadi kedua, jadi pada kasus ini kita cocok menggunakn event yang mana nih, dan yang ini yang mana seperti itu.oke maka dari itu disini saya akan mencoba membuat cara menggunakan event onsubmit dan event onclick di javascript, jangankemana-mana simak terus ya teman-teman.

Oke yang jelas nanti ketika cara menggunakan event onsubmit dan event onclick di javascript, saya akan mencontohkannya langsung dua ya,jadi sebenarnya event onsubmit bisa di gunakan ketika kita menggunakan object javascript yaitu object forms ya benar, jadi kita tidak bisa menggunakan langsung dari tombolnya, jadi alurnya bukan ketika variabel tombolnya yang kita click, tetapi sebuah variabel formnya yang kita klik seperti itu, lain halnya dengan kita menggunakan event click, jika event klik, alur yang kita pakai adalah ketika varibel tombolnya kita klik seperti itu ya, apakah masih bingung oke, supaya tidak bingung langsung saja saya contohkan terlebih dahulu yang event onsubmit ya, jadi seperti ini:

1

2

3

var form = document.forms[0];

var inputNode = document.querySelectorAll("input");

var pNode = document.querySelector("p")

1

2

3

4

5

6

7

// CARA MENGGUNAKAN ONSUBMIT

form.onsubmit = inputsubmit;  //menggunakan object javacsriptnya, yaitu document forms

function inputsubmit(event){

event.preventDefault()

var hasil = inputNode[0].value

pNode.innerHTML = `Yang anda inputkan adalah <strong>"${hasil}" </strong>`

}

Bisa dilihat ya, jadi saya membuat sebuah variabel form dimana ketika kita menggunakan event onsubmit, varibel itu lah yang kita esekusi, bukan tombolnya ya, tetapi ada juga pertanyaan kenapa harus formnya, oke jika kita menggunakan tombolnya yang kita berikan onsubmit, jawabannya itu tidak bisa, dan biasanya object forms ini digunakan untuk sebuah forms ya, dan bisa kita lihat juga ada sebuah kurung siku [0], itu menandakan bahwa yang kita esekusi adalah sebuah form yang pertama. oke sekarang kita lihat yang event clicknya:

1

2

3

4

5

6

// CARA MENGGUNAKAN ONCLICK or CLICK

inputNode[1].addEventListener("click", function(e){

e.preventDefault()

var hasil = inputNode[0].value

pNode.innerHTML = `Yang anda inputkan adalah <strong>"${hasil}" </strong>`

})

Bisa di lihat ya, jika kita menggunakan event click, kita bisa menggunakan di sebuah tombolnya, dan saya rasa cukup sampai disini dulu belajar kita tentang cara menggunakan event onsubmit dan event onclick di javascript, semoga bermanfaat dan sampai jumpa pada artikel selanjtunya terimakasih.

Apa itu Submit form?

Apa yang dimaksud dengan form validasi?

Apa itu form pada pemrograman?

Atribut pada sebuah form yang berfungsi untuk menjelaskan kemana data form akan dikirimkan adalah?