pagi all, mohon petunjuknya ya.. maaf sebelumnya bila ane salah kamar :
ane lagi coba buat website dari CI + JQuery. rencananya ane ada 1 form untuk CRUD data kedalam database dengan JQuery ajax :
berikut kronologinya ane buatnya gan :
di form admin ane ada anchor <a> dengan id='btn-show'
Code:
<a id="btn-show" href="#">Show</a>
ketika link ini di klik akan muncul 1 popup yang isinya form untuk CURD tadi gan
Code:
$('#btn-show').click(function (e) { $('#modal').modal(); return false; });
dan ini wrapper #modal-nya yang sudah ane include di awal2 di form admin ane dengan display:none;
Code:
<div id="modal" class="content hide">
<input id="txt_nama" type="text">
<input id="btn-add" type="submit" name="instansi">
<div id="my_table">
<?php if (isset($my_table)) echo $my_table; ?>
</div>
</div>
$my_table diatas adalah variable yang ane passing dari controller CI yang isinya hasil generate dari helper table gan :
Code:
private function _set_my_table() {
$this->load->library('table');
$this->table->set_heading('No', 'Nama', 'Status', 'Action');
$i = 0;
foreach ($this->_get_master() as $value) {
$this->table->add_row(
array('data' => ++$i, 'class' => 'table-column-no text-left'),
$value->name,
$value->status,
array('data' => anchor('#', 'Delete', array('class' => 'btn-del', 'no_master' => $value->no_master)), 'class' => 'text-center')
);
}
return $this->table->generate();
}
jadi, masing2 row ane beri class='btn-del' untuk proses delete nantinya gan. kemudian ini script ketika #btn-add di submit :
Code:
$('#btn-add').click(function (e) { add_master(); return false; });
function add_master(key) {
var name = $('#txt_nama').val();
$.ajax({
type: "POST",
url: "<?php echo site_url('admin/add_master'); ?>",
dataType: "json",
data: {name : name},
cache:false,
success: function(data){ [B]$('#my_table').html(data.my_table);[/B] },
error: function(data){ alert('error'); }
});
}
yang ane bold itu #my_table akan diisi ulang dari generate table yang baru setelah data sukses diinput gan. dan ini script di CI untuk save ke databasenya gan.
Code:
public function add_master() {
$name = $this->input->post('name');
if (empty($name)) return false;
$insert = array( 'Name' => $name, 'status' => 'Active' );
$str_model = $this->_table_master;
$this->load->model($str_model, '', true);
$no_master = $this->$str_model->save($insert);
$this->_set_master($this->$str_model->get_all()->result());
[B]$this->_data['my_table'] = $this->_set_my_table();[/B]
echo json_encode($this->_data);
}
diatas yang ane bold menunjukkan kalo ane generate ulang table masternya gan dan ane tempel kembali di #my_table sesuai yang ane bold di kode JQuery diatas yang ane bold
$('#my_table').html(data.my_table);
nyampe disini kode ane masih lancar jaya gan, modal bisa muncul, data bisa kesimpen di database, dan tampilan #my_table juga ter-update secara ajax ketika #btn-add di click.
permasalahannya adalah ketika ane mau mencoba manambahkan fitur delete di #my_table hasil generate tadi gan. berikut kodenya :
Code:
$('.btn-del').click(function (e) { var id = $(this).attr("no_master"); delete_master(id); return false; });
function delete_master(id) {
$.ajax({
type: "POST",
url: "<?php echo site_url('admin/delete_master'); ?>",
dataType: "json",
data: {id : id},
cache:false,
success: function(data){ $('#my_table').html(data.my_table);},
error: function(data){ alert('error'); }
});
}
dan ini script CI untuk deletenya gan :
Code:
public function delete_master() {
$name = $this->input->post('name');
if (empty($id)) return false;
$update = array( 'status' => 'InActive');
$str_model = $this->_table_master;
$this->load->model($str_model, '', true);
$no_master = $this->$str_model->update($update, $id);
$this->_set_master($this->$str_model->get_all()->result());
[B]$this->_data['my_table'] = $this->_set_my_table();[/B]
echo json_encode($this->_data);
}
di fungsi delete ini ane juga set #my_table kembali gan. nah masalahnya muncul disini gan, untuk delete yang pertama kali (row mana saja) data berhasil terdelete dan #my_table berhasil ter-update. tapi pas klik ke link delete berikutnya (row mana saja) ane malah ke redirect ke halaman depan gan.
yang ingin ane tanyakan apakah kita tidak bisa memanipulasi DOM pada content (dalam hal ini #my_table) yang digenerate secara dynamic seperti itu gan. karena setelah ane coba refresh delete yang pertama kembali berfungsi selanjutnya tetap redirect ke halaman depan. atau mungkin ada yang salah dengan script ane?
mohon petunjuknya gan..
, maaf belum bisa ngasih cendol ane masih newbie.. yang jelas trims banget gan.
oh ya, sebenernya ada satu lagi yang ane temuin.. ternyata juga ada masalah di modal-nya.. secara default modal men-clone target contentnya sehingga apapun yang di update didalam modal akan kembali ke seperti semula ketika modal ditutup. setelah browsing cara untuk mencegah clone pada modal adalah dengan menambah
. dengan option ini mencegah modal untuk menclone content dan mengupdate DOM sesuai dengan perubahan di modal.
terimakasih agan semua... CASE CLOSED