Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <html>
- <head>
- <title>Submit Form Dengan Jquery</title>
- <script language="javascript" src="https://code.jquery.com/jquery-1.8.3.js"></script>
- <!--perintah jquery beraksi-->
- <script>
- $(document).ready(function(){
- /*jika tombol submit ditekan*/
- $('#submit').click(function(){
- //ambil value/data yang diinput pada nama
- var nama = $('#nama').val();
- //ambil value/data yang diinput pada pekerjaan
- var job= $('#job').val();
- //ambil value/data yang diinput pada kota
- var kota = $('#kota').val();
- //ambil value/data yang diinput pada No. Telepon
- var phone = $('#phone').val();
- //set tr td untuk diset pada tabel
- var data = '<tr>';
- data +='<td><input type="hidden" name="nama[] value="'+nama+'" />'+nama+'</td>';
- data +='<td><input type="hidden" name="job[] value="'+job+'" />'+job+'</td>';
- data +='<td><input type="hidden" name="kota[] value="'+kota+'" />'+kota+'</td>';
- data +='<td><input type="hidden" name="phone[] value="'+phone+'" />'+phone+'</td>';
- data +='</tr>';
- //set data pada tabel
- $('#dataPegawai').append(data);
- //kosongkan form
- $('#myForm')[0].reset();
- });
- });
- </script>
- <!--/perintah jquery beraksi-->
- </head>
- <body>
- <form action="" method="post" id="myForm">
- <table>
- <caption><h3>Tutorial Jquery Submit Form</h3></caption>
- <tr>
- <td>Nama</td>
- <td>:</td>
- <td><input type="text" name="nama" id="nama" size="35" /></td>
- </tr>
- <tr>
- <td>Pekerjaan</td>
- <td>:</td>
- <td><input type="text" name="job" id="job" size="36" /></td>
- </tr>
- <tr>
- <td>Kota</td>
- <td>:</td>
- <td><input type="text" name="kota" id="kota" /></td>
- </tr>
- <tr>
- <td>No. Telepon</td>
- <td>:</td>
- <td><input type="text" name="phone" id="phone" /></td>
- </tr>
- <tr>
- <td> </td>
- <td> </td>
- <td><input type="button" id="submit" value="Submit" /></td>
- </tr>
- </table>
- </form>
- <form action="proses.php" method="post">
- <table border="1">
- <tr>
- <th>Nama</th>
- <th>Pekerjaan</th>
- <th>Kota</th>
- <th>No. Telepon</th>
- </tr>
- <tr>
- <tbody id="dataPegawai"></tbody>
- </tr>
- </table>
- <input type="submit" name="simpan" value="Simpan" />
- </form>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement