我试图禁用数据表的默认排序,但它继续排序 . 我有两个表,一个显示详细数据,一个按区域分组 . 在我获取数据集中的数据后的BLL中,我添加了另一行,这是其他行的总和 . 我把它传递给jquery,即使我已经设置了“order”:[]和“aaSorting”:[],它仍然对它进行排序 . 用户单击按钮时会填充表格 .
当我添加断点并查看json数据时,它按我想要的顺序(总行位于底部),但在表中,toal行显示在中间(根据其名称),就像这样:
Area
--------
Capital Metro
Eastern
National (this is the total row)
Northeast
Pacific
....
<script>
function populteTable(ws_url, parameters, table) {
$.ajax({
type: "POST",
dataType: "json",
contentType: "application/json; charset=utf-8",
url: ws_url,
cache: false,
data: parameters,
}).done(function (result) {
table.clear().draw();
jResult = JSON.parse(result.d);
table.rows.add(jResult).draw();
}).fail(function (jqXHR, textStatus, errorThrown) {
alert(textStatus + ' - ' + errorThrown);
});
}
/* I want this sorted */
tblFacCert = $("#tblFacCert").DataTable({
jQueryUI: true,
data: [],
dom: 'lfrtip',
stateSave: true,
order: [[0, "asc"],[1, "asc"]],
"columns": [
{
"data": "Area"
}, {
"data": "District"
}, {
"data": "FacilityName"
}, {
"data": "ResponseDueDate",
}, {
"data": "Completed"
}, {
"data": "ResponseDate"
}
],
"columnDefs": [
{
"targets": [5],
"render": function (data, type, row) {
if (null == data)
return data;
return stringToTimestamp(data);
}
},
{
"targets": [3],
"render": function (data, type, row) {
if (null == data)
return data;
return stringToDatestamp(data);
}
}
],
"pageLength": 15,
processing: true
});
/* I don't want this sorted */
tblStats = $("#tblStats").DataTable({
data: [],
dom: 'lfrtip',
stateSave: true,
"order": [],
"aaSorting": [],
"columns": [
{
"data": "Area"
}, {
"data": "Total"
}, {
"data": "Cnt_Certified"
}, {
"data": "Cnt_NotCertified"
}, {
"data": "Percentage_cert"
}
],
"pageLength": 15,
processing: true
});
$("#btnSubmit").on("click", function (event) {debugger
var facCertUrl = "../services/easg.asmx/GetComplianceReportData";
var facCertParams = "{ 'startDate': '" + $("#tbStartDate").val() + "', 'certID': '" + $('#ddlCertificate').val() + "'}";
var statsUrl = "../services/easg.asmx/GetFacComplianceByArea";
var statsParams = "{ 'startDate': '" + $("#tbStartDate").val() + "', 'certID': '" + $('#ddlCertificate').val() + "'}";
populteTable(statsUrl, statsParams, tblStats);
populteTable(facCertUrl, facCertParams, tblFacCert);
})
</script>
Update
使用黑曜石的建议:
tblStats = $("#tblStats").DataTable({
data: [],
dom: 'lfrtip',
stateSave: true,
"columns": [
{
"data": "Area"
}, {
"data": "Total"
}, {
"data": "Cnt_Certified"
}, {
"data": "Cnt_NotCertified"
}, {
"data": "Percentage_cert"
}
],
"columnDefs": [
{
"aTargets": [0],
"bSortable" : false
}
]
});
这仍然会对列0(区域)进行排序,并阻止对其他列进行排序 . 将aTargets设置为[1,2,3,4]无效 . 唯一有效的是设置bSort:false,其缺点是在填充表格后不允许任何排序 .
1 回答
从版本1.10开始,Datatables通过以下方式对数据进行排序:
订单
初始化期间DataTables未应用任何排序 . 这些行按DataTables读取的顺序显示(即DOM源的DOM原始顺序,或者Ajax /数据源的数据数组):
多列排序作为初始状态:
示例
订购
禁用表中的排序:
示例
LEGACY - Datatables Pre 1.10
如果您使用的是旧版本的数据表,则可以使用下面提到的旧方法进行排序:
bSort
启用或禁用列的排序 . 可以通过每列的
bSortable
选项禁用对各列的排序 .参考:https://legacy.datatables.net/ref#bSort
bSortable
可以通过每列的
bSortable
选项禁用对各列的排序 .在此示例中,具有类
Sort
的列将是可排序的 .