前提: datatable 定義

var table = $('#example').DataTable({"ajax": "donor/book_donation_data.php",responsive: true,//data: data,columns: [{data: 'id'},{data: 'donor'},{data: 'book_name'},{data: 'author'},{data: 'publishing_time'},{data: 'price'},{data: 'donor_duplicate'},{data: 'holdings'},{data: 'call_number'},{data: 'donation_time'}],"fnPreDrawCallback": function(oSettings) {$('.dataTables_filter input').attr({'name': 'search','placeholder': '搜索站內(nèi)新聞公告'}); //提示},language: {????????"sProcessing": "處理中...","sLengthMenu": "顯示 _MENU_ 項(xiàng)結(jié)果","sZeroRecords": "沒有匹配結(jié)果","sInfo": "顯示第 _START_ 至 _END_ 項(xiàng)結(jié)果，共 _TOTAL_ 項(xiàng)","sInfoEmpty": "顯示第 0 至 0 項(xiàng)結(jié)果，共 0 項(xiàng)","sInfoFiltered": "(由 _MAX_ 項(xiàng)結(jié)果過濾)","sInfoPostFix": "","sSearch": "搜索:","sUrl": "","sEmptyTable": "表中數(shù)據(jù)為空","sLoadingRecords": "載入中...","sInfoThousands": ",","oPaginate": {????????????"sFirst": "首頁","sPrevious": "上頁","sNext": "下頁","sLast": "末頁"????????},"oAria": {????????????"sSortAscending": ": 以升序排列此列","sSortDescending": ": 以降序排列此列"????????}????} });

新增 : 參考?http://www.datatables.club/example/api/add_row.html

table.row.add( [data.mydata[0].d1,data.mydata[0].d2,data.mydata[0].d3,data.mydata[0].d4,data.mydata[0].d5,data.mydata[0].d6,data.mydata[0].d7,data.mydata[0].d8,data.mydata[0].d9 ] ).draw();

修改? ?參考:?https://datatables.net/reference/api/row().data()

var data_list = data.mydata[0]; var d = table.row('.selected').data();d.id = data_list.id; d.donor = data_list.donor; d.book_name = data_list.book_name; d.author = data_list.author; d.publishing_time = data_list.publishing_time; d.price = data_list.price; d.donor_duplicate = data_list.donor_duplicate; d.holdings = data_list.holdings; d.call_number = data_list.call_number; d.donation_time = data_list.donation_time;table.rows('.selected').invalidate();table.rows('.selected').data(d).draw();

刪除

table.rows('.selected').remove().draw();

?

?

查詢

1.自定義查詢框

div class="am-u-sm-12 am-u-md-4"><div class="am-input-group"><input id="donor_search_input" type="text" class="am-form-field"><span class="am-input-group-btn"><button id="donor_search_btn" class="am-btn am-btn-default" type="button">搜索</button></span></div></div>

2. 自定義查詢 js

$('#donor_search_input').on('keyup', function () {table.search(this.value).draw();});$('#donor_search_btn').on('onclick', function () {table.search(this.value).draw();});

?

總結(jié)

以上是生活随笔為你收集整理的datatables 增、删、查、改的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。