Beberapa waktu lalu saya sudah membuat sebuah Artikel tentang jquery append() , nah jquery append ini berguna untuk menambah sebuah elemen pada HTML . Sekarang bagaimana jika kita terapkan pada kasus input Data Multiple dan di padukan dengan mr Php . Jquery append ini memberikan kemudahan buat si Pemakai applikasi nantinya karena tidak harus mengakses form input berkali - kali , Hanya dengan 1 kali input dan klik tombol untuk menjalankan script append nya maka form akan bertambah satu dan seterusnya.
baiklah langsung saja kita mulai , yang pertama silahkan buke editor kesayangan anda kemudian ketika kode berikut dan simpan dengan nama form.php : <script> $(document).ready(function() { var nomor = 0; var status=""; $("#tambah").click(function(){ nomor ++; $('#konten').append( '<tr class="baris">' + '<input name="nomor[]" value="'+ nomor +'" type="hidden" ></td>' + '<td><input name="meninggal'+ nomor +'" type="text" class="name"></td>' + '<td><input name="luka_berat'+ nomor +'" type="text" class="name"></td>' + '<td><input name="luka_ringan'+ nomor +'" type="text" class="name"></td>' + '<td><input name="hilang'+ nomor +'" type="text" class="name"></td>' + '<td><input name="pengungsi_kk'+ nomor +'" type="text" class="name"></td>' + '<td><input name="pengungsi_jiwa'+ nomor +'" type="text" class="name"></td></tr>' ); }); $("#myfrm").validate({ debug: false, rules: { }, messages: { }, submitHandler: function(form) { $.post('simpanData.php?act=tambah', $("#myfrm").serialize(), function(data) { $('#tabel').slideUp(); $('#hasil').html(data); status = ""; }); } }); }); function tampilTabel() { if(status=="") { $('#tabel').slideDown(); status="1"; } else { $('#tabel').slideUp(); status=""; } } </script> Kemudian buat code untuk proses simpan nya dengan nama simpanData.php if( isset($_GET['act']) ) { /* * oper semua vars*/ $id = $_POST['id_bencana']; if( $_GET['act'] == 'tambah' ){ if($_POST['nomor']!="") { foreach($_POST['nomor'] as $i) { $nama = $_POST['id_bencana']; $kec = $_POST['id_kecamatan'.$i]; $meninggal =$_POST['meninggal'.$i]; $berat = $_POST['luka_berat'.$i]; $ringan = $_POST['luka_ringan'.$i]; $hilang = $_POST['hilang'.$i]; $kk = $_POST['pengungsi_kk'.$i]; $jiwa = $_POST['pengungsi_jiwa'.$i]; $query = "insert into tb_korban(id_bencana,id_kecamatan,meninggal,luka_berat,luka_ringan,hilang,pengungsi_kk,pengungsi_jiwa) values ('$nama','$kec','$meninggal','$berat','$ringan','$hilang','$kk','$jiwa')"; $sql = mysql_query( $query ); } } } Perintah Perulangan diatas ( foreach ) menentukan berapa kali append dilakukan pada form. baiklah selesai sudah Tutorial mengenai kobinasi php dan jquery append untuk insert multiple data terimakasih . Regards Rokansoft.
EmoticonEmoticon