Pada artikel ini, kita akan melihat cara mengirimkan formulir tanpa mengklik tombol kirim, bersama dengan memahami berbagai cara untuk menyelesaikan tugas ini melalui implementasi.
Formulir dapat dikirimkan tanpa menggunakan tombol kirim dengan menerapkan atribut acara tertentu atau dengan mengklik tautan. Tugas ini dapat dilakukan dengan menggunakan atribut event OnClick atau dengan menggunakan metode form.submit() dalam Javascript.
Mendekati: Metode form.submit() dalam JavaScript dapat digunakan untuk mengirimkan formulir tertentu. Ini mirip dengan mengaktifkan submit
Contoh 1: Contoh ini menggambarkan cara mengirimkan formulir tanpa tombol kirim dan menyimpan data dalam database menggunakan phpMyAdmin.
Catatan: dengan atribut type=”submit” tidak akan dikirimkan dengan formulir saat menggunakan metode ini.
index.php
<!DOCTYPE html>
<html>
<head>
<title>Form Submittion without using submit Button</title>
</head>
<body>
<h1style="color: green">
GeeksforGeeks
</h1>
<h3>
Form Submittion without using submit Button
</h3>
<formid="form"
action="form.php"
method="post">
<label>
Subscribe the GBlog to get daily update!!!
</label>
<br><br>
<inputtype="text"
name="text"
placeholder="Enter Mail ID"/>
<br/>
<h5onclick="submit()">
Click Me to Subscribe!
</h5>
</form>
<script>
function submit() {
let form = document.getElementById("form");
form.submit();
alert("Data stored in database!");
}
</script>
</body>
</html>
form.php: Kode ini akan membantu kita untuk menghubungkan PHP dengan database dan menyimpan data yang dikirimkan oleh pengguna.
Penjelasan: Di sini, kita perlu menambahkan data yang diisi dalam formulir ke database tanpa menggunakan tombol kirim. Untuk ini, kita perlu memicu fungsi submit() menggunakan elemen HTML. Menggunakan getElementById() metode, kami telah menargetkan formulir yang diperlukan untuk diserahkan. Segera setelah HTML diklik kirim () dieksekusi dan data disimpan dalam database. Pada contoh di atas, kita telah menggunakan the
tag untuk memicu fungsi kirim.
Keluaran:
Teks yang diketik akan disimpan di database setelah mengklik elemen HTML seperti yang ditampilkan di gif.
Contoh 2: Contoh ini menjelaskan cara menggunakan gambar untuk mengirimkan formulir. Di sini, kami telah menggunakan tag untuk memicu fungsi submit(). Di sini, kita akan menggunakan form.php file untuk menyimpan data yang dikirimkan oleh pengguna.
index.php
<html>
<head>
<title>Submit a form using image</title>
</head>
<body>
<formid="form"action="form.php"method="post">
<inputtype='text'name='text'/>
<ahref="javascript: submit()">
<imgsrc="gfg.jpg"width="35"height="30"/>
</a>
</form>
<script>
function submit(){
form.submit();
alert("Data stored in database!");
}
</script>
</body>
</html>
Penjelasan: Di kedua contoh di atas, segera setelah elemen HTML diklik, ‘onclick‘ acara dipicu oleh elemen penargetan menggunakan getElementById() metode.Kemudian formulir.kirim() fungsi dijalankan untuk mengirimkan formulir.
