Postingan lainnya
Kelas Premium!
Belajar bikin website dari nol sekarang
Gunakan kupon "lebihcepat" untuk diskon 25%!
Kelas Premium!
Belajar Javascript untuk website
Gunakan kupon "mulaijs" untuk diskon 75 ribu!
Tidak dapat memanggil class CSS dari datatable serverside
Code datatable:
$('#datatable-serverside').DataTable({
"iDisplayLength": 5,
"aLengthMenu": [[5, 25, 50, 100, -1], [5, 25, 50, 100, "All"]],
"bProcessing": true,
"serverSide": true,
"ajax": {
url: "supplier/response.php", // json datasource
type: "post", // type of method ,GET/POST/DELETE
"dataSrc": function (jsonData) {
for (var i = 0, len = jsonData.data.length; i < len; i++) {
jsonData.data[i][2] = jsonData.data[i][2] + '<br>' + jsonData.data[i][3];
jsonData.data[i][3] = jsonData.data[i][4];
jsonData.data[i][4] = '<button type="button" class="open_modal btn btn-success" id_supplier="' + jsonData.data[i][5] + '" title="Edit"><i class="fa fa-edit"></i> Edit</button>';
}
return jsonData.data;
},
error: function () {
$("#supplier_grid").append('<tbody><tr><th colspan="5">Tidak ditemukan data di server.</th></tr></tbody>');
}
}
});
$('#datatable-biasa').DataTable({
"iDisplayLength": 5,
"aLengthMenu": [[5, 25, 50, 100, -1], [5, 25, 50, 100, "All"]]
});
Code javascript:
var $lba = document.getElementsByClassName('open_modal');
function myPopup() {
var m = $(this).attr("id_supplier");
$.ajax({
url: "supplier/modal_edit.php",
type: "GET",
data: {id: m, },
success: function (ajaxData) {
$("#ModalEdit").html(ajaxData);
$("#ModalEdit").modal('show', {backdrop: 'true'});
}
});
}
for (var i = 0; i < $lba.length; i++)
$lba[i].onclick = myPopup;
Class yang saya panggil adalah class: open_modal Script ini dapat berjalan dengan baik apabila menggunakan datatable biasa seperti di dalam script php berikut:
<table id="datatable-biasa" class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%">
<thead>
<tr>
<th>No</th>
<th>Nama Supplier</th>
<th>Telepon</th>
<th>Alamat</th>
<th>Aktif</th>
<th>Pilihan</th>
</tr>
</thead>
<tbody>
<?php
$tampil = mysqli_query($con, "SELECT * FROM supplier WHERE aktif <> 'Deleted' ORDER BY aktif ASC, nama_supplier ASC");
$no = 1;
while ($r = mysqli_fetch_array($tampil)) {
if ($r[telepon1] == "") {
$tel = "-";
} else {
$tel = $r[telepon1];
}
if ($r[telepon2] == "") {
$tel2 = "-";
} else {
$tel2 = $r[telepon2];
}
echo "<tr>
<td>$no</td>
<td>$r[nama_supplier]</td>
<td>$tel<br>$tel2</td>
<td>$r[alamat]</td>
<td>$r[aktif]</td>
<td>";
?>
<button type="button" class="open_modal btn btn-success" id_supplier="<?php echo $r[id_supplier]; ?>" title="Edit"><i class="fa fa-edit"></i> Edit</button>
<?php
echo "</td></tr>";
$no++;
}
?>
</tbody>
</table>
<!-- Form Edit Data-->
<div id="ModalEdit" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>
<!-- End Form Edit Data-->
Namun jika menggunakan datatable server side seperti di dalam kode script php berikut tidak bisa,
<table id="datatable-serverside" class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%">
<thead>
<tr>
<th>Nama Supplier</th>
<th>Alamat</th>
<th>Telepon</th>
<th>Aktif</th>
<th>Pilihan</th>
</tr>
</thead>
</table>
<!-- Form Edit Data-->
<div id="ModalEdit" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>
<!-- End Form Edit Data-->
Mohon bantuannya. Terima kasih.
2 Jawaban:
Jawaban Terpilih
Finally, solved teman-teman sekalian. Diubah metode fungsinya, dari pemanggilan class jadi onclick.
jsonData.data[i][4] = '<button type="button" class="btn btn-success" onclick="editForm(\'ModalEdit\', \''+ jsonData.data[i][5] +'\')" title="Edit"><i class="fa fa-edit"></i> Edit</button>';
function editForm(id, value) {
var e = document.getElementById(id);
if (e.style.display == 'none') {
var m = value;
$.ajax({
url: "modul/mod_supplier/modal_edit.php",
type: "GET",
data: {id: m, },
success: function (ajaxData) {
$("#ModalEdit").html(ajaxData);
$("#ModalEdit").modal('show', {backdrop: 'true'});
}
});
}}
makasih udah mau share jawabannya, ditandain aja jadi jawaban yang benar, biar kalo ada yang punya kesalah sama, bisa ada referensi