Belajar HTML CSS : Membuat Form Multi Submit Dengan Multi Link

Belajar HTML CSS : Membuat Form Multi Submit Dengan Multi Link


Masing-masing developer memiliki cara-cara individu tersendiri dalam memproses suatu form, ada yang menggunakan button submit, ada yang menggunakan link, ada juga yang menggunakan image, atau bahkan tidak ada yang menggunakan button, biasanya yang terakhir ini menggunakan bantuan lain yakni ajax form submission dan metode-metode lain. Namun bagaimana caranya menggunakan multi link untuk memproses suatu form.

Pada artikel sebelumnya penulis pernah membahas bagaimana membuat submit button dengan link image . Pada tutorial kali ini penulis akan menjelaskan kepada Anda, bagaimana caranya Membuat Form Multi Submit Dengan Multi Link. Sebelum ke inti pembahasan, banyak sekali alasan mengapa developer menggunakan metode ini, salah satunya adalah faktor layout, dan keindahan. Dan lagi membuat submit button dengan link ini dimemerlukan si submit ini harus berada di dalam tag <form></form> melainkan bisa diletakkan di luarnya, cukup dipanggil saja form apa yang akan di kirimkan datanya, kurang lebih seperti itu.

Kita siapkan terlebih dahulu 1 buah form dalam 1 file, misalkan file tersebut adalah form.php. Isinya kurang lebih adalah seperti ini :

<html>

<head><title>Multi Submit Link</title></head>

<body>

<form action="cek.php" name="form_cek" id="form_cek">

<label for="nama">Nama:</label><input type="text" name="nama" id="nama" />

</form>

<a href="" onclick="document.form_cek.action = 'cari.php'; document.form_cek.method='get'; document.form_cek.submit(); return false;">Cari</a>

<a href="" onclick="document.form_cek.action = 'edit.php'; document.form_cek.submit(); return false;">Edit</a>

</body>

</html>

 

kemudian yang kedua adalah file cari.php berisi :

<?php echo $_REQUEST['nama'];?>

 

dan terakhir file edit.php berisi :

<?php echo $_GET['nama'];?>

 

lihat kembali di form.php, di form tersebut tidak ada submit button sama sekali tapi sebagai gantinya, kita menggunakan link sebagai submit buttonnya.

<a href="" onclick="document.form_cek.action = 'cari.php'; document.form_cek.method='get'; document.form_cek.submit(); return false;">Cari</a>

 

Submit button dengan link ini bisa berjalan dengan mulus dengan catatan, si form harus memiliki id dan name tentunya sehingga javascript memanfaatkan link untuk memanggil id si form tersebut seperti ini

document.form_cek.action = 'cari.php'; document.form_cek.method='get'; document.form_cek.submit(); return false

 

Jelas ya? Selamat Mencoba.

Artikel Terkait :