使用DataTables插件与后台对接表格
function getResults(){ var callResults = $.ajax({ url: "。。。。", //接口url type: "GET", //请求方式 dataType: "json", headers: { Accept: "application/json;odata=verbose" }, success: function (resp) { //请求成功后要做的事情 $('#loadicon').hide(); //这里是隐藏loading图 $('#main').show(); //显示表格 } }); callResults.done(function (data, textStatus, jqXHR){ $('#example').DataTable( { "bDestroy": true, "bProcessing": true, "aaData": data.list, //后台传过来的数据里面的要显示的数据的名称(数组名称) "aoColumns": [ //要显示数据的每一列 { "mData": "project_name" }, { "mData": "process_status" }, { "mData": "create_time" }, { "mData": "need_feedback_time" }, { "mData": "real_feedback_time"} ], "language": { //原先显示都是英文,改成中文 "lengthMenu": "每页显示 _MENU_ 条", "paginate": { "first": "第一页", "last": "最后一页", "next": "下一页", "previous": "上一页" }, "emptyTable": "没有数据", "info": "显示 _START_ 到 _END_ 共 _TOTAL_ 条数据", "infoEmpty": "显示 0 到 0 共 0 条数据", "infoPostFix": "", "thousands": ",", "loadingRecords": "没有数据", "processing": "处理中...", "search": "查找:", "zeroRecords": "没有匹配的数据", "infoFiltered": "(过滤总件数 _MAX_ 条)" }, "ordering": true, //有排序功能 "order": [[ 2, "desc" ]], //刚开始的时候按第三列降序排列 "lengthMenu": [ [10, 25, 50, -1], [10, 25, 50, "All"] ], //一页显示多少条记录 "fnRowCallback": function( nRow, aData, iDisplayIndex ) {//实现行点击,并且能跳转 $(nRow).on( 'click', function () { // logger.e(JSON.stringify(aData)); // logger.e(JSON.stringify(nRow)); // logger.e(iDisplayIndex); $(this).toggleClass('selected'); let processId=aData.process_id; window.location.href = "result.html?process=" + processId; }); } } ); }); callResults.fail(function (jqXHR, textStatus, errorThrown){ alertDD("表格发生错误: " + jqXHR.responseText); }); }