JS DataTables 这个组件绑定数据必须要有自己的返回数据格式。但是ABP返回的格式直接绑定是错误。添加DataTables JS 扩展、数据加载等。ABP 原作者已经在ABP.ZERO CORE 项目有相应的应用。
DataTable JS 扩展:
1 /************************************************************************ 2 * datatables AJAX 扩展 * 3 *************************************************************************/ 4 (function ($) { 5 6 if (!$.fn.dataTableExt) { 7 return; 8 } 9 10 var doAjax = function (listAction, requestData, callbackFunction, settings) { 11 var inputFilter = {}; 12 13 //设置表过滤器 14 if (listAction.inputFilter) { 15 inputFilter = $.extend(inputFilter, listAction.inputFilter()); 16 } 17 18 //设置分页过滤器 19 if (settings.oInit.paging) { 20 inputFilter = $.extend(inputFilter, { 21 maxResultCount: requestData.length, 22 skipCount: requestData.start 23 }); 24 } 25 26 //排序过滤器 27 if (requestData.order && requestData.order.length > 0) { 28 var orderingField = requestData.order[0]; 29 if (requestData.columns[orderingField.column].data) { 30 inputFilter.sorting = requestData.columns[orderingField.column].data + " " + orderingField.dir; 31 } 32 } 33 34 35 if (listAction.ajaxFunction) { 36 listAction.ajaxFunction(inputFilter) 37 .done(function (result) { 38 settings.rawServerResponse = result; 39 callbackFunction({ 40 recordsTotal: result.totalCount, //总数 41 recordsFiltered: result.totalCount, 42 data: result.items //数据项 43 }); 44 }); 45 } 46 } 47 48 if (!$.fn.dataTable) { 49 return; 50 } 51 52 $.extend(true, $.fn.dataTable.defaults, { 53 ajax: function (requestData, callbackFunction, settings) { 54 if (!settings) { 55 return; 56 } 57 58 if (!settings.oInit) { 59 return; 60 } 61 62 if (!settings.oInit.listAction) { 63 return; 64 } 65 66 doAjax(settings.oInit.listAction, requestData, callbackFunction, settings); 67 } 68 }); 69 //重新加载 70 $.fn.dataTable.Api.register('ajax.reloadPage()', function () { 71 this.ajax.reload(null, false); 72 }); 73 74 })(jQuery);