我正在研究数据表,我发现我对日期列的排序不起作用。这是我的截图
这是我的代码
<table id="tbl" class="table table-small-font table-bordered table-striped">
<thead>
<tr>
<th> </th>
<th class="text-left">Dated</th>
<th class="text-left">Day</th>
<th class="text-center">Remarks</th>
<th class="text-center">State</th>
<th class="text-center"></th>
</tr>
</thead>
<tbody>
@{ IEnumerable
<PublicHoliday> PublicHolidays = (IEnumerable
<PublicHoliday>)ViewData["PublicHolidays"]; int Idx = 1; } @foreach (var i in PublicHolidays) {
<tr>
<td>@Idx</td>
<td>@i.Dated.ToString("dd-MMM-yyyy hh:mm tt")</td>
<td>@i.Dated.ToString("ddd")</td>
<td>@Html.DisplayFor(x => i.Remarks)</td>
<td>@i.ForStateName</td>
<td><a data-toggle="tooltip" title="Delete" onclick="DeleteRecord(@i.Id);"><span class="glyphicon glyphicon-remove"></span></a></td>
</tr>
Idx++; }
</tbody>
</table>
<script src="~/lib/jquery-ui-1.12.1/jquery-ui.min.js"></script>
<script src="~/js/jquery.dataTables.min.js"></script>
<script src="~/js/dataTables.bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var tbl = $('#tbl').DataTable({
dom: "<'row'<'col-sm-6 col-xs-7'l><'col-sm-6 col-xs-7'f>>" + "rtip",
order: [
[0, "asc"]
],
pagingType: "numbers",
iDisplayLength: 50
});
});
</script>
sort列根本不起作用,我找不到任何来自datatable的插件。有人请帮忙..提前谢谢
答案 0 :(得分:2)
我不确定是否有任何支持date-dd-MMM-yyyy hh:mm tt format
所以我修改了插件以支持这种格式。
以下是代码。加载datatable
插件后加载此代码
(function() {
var customDateDDMMMYYYYToOrd = function(date) {
var dateTime = date.split(' '),
dateObj = new Date(dateTime[0].replace(/-/g, ' ')),
time = "00:00",
type = "AM";
if (dateTime.length > 1) { // if time part and am/pm part is available
time = dateTime[1],
type = dateTime[2];
}
var splitTime = time.split(":"),
hours = type == "PM" ? Number(splitTime[0]) + 12 : Number(splitTime[0]),
minutes = Number(splitTime[1]),
seconds = 0,
milliseconds = 0;
return new Date(dateObj.getFullYear(), dateObj.getMonth(), dateObj.getDate(), hours, minutes, seconds, milliseconds);
};
// This will help DataTables magic detect the "dd-MMM-yyyy" format; Unshift
// so that it's the first data type (so it takes priority over existing)
jQuery.fn.dataTableExt.aTypes.unshift(
function(sData) {
"use strict"; //let's avoid tom-foolery in this function
if (/^([0-2]?\d|3[0-1])-(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)-\d{4}/i.test(sData)) {
return 'date-dd-mmm-yyyy';
}
return null;
}
);
// define the sorts
jQuery.fn.dataTableExt.oSort['date-dd-mmm-yyyy-asc'] = function(a, b) {
"use strict"; //let's avoid tom-foolery in this function
var ordA = customDateDDMMMYYYYToOrd(a),
ordB = customDateDDMMMYYYYToOrd(b);
return (ordA < ordB) ? -1 : ((ordA > ordB) ? 1 : 0);
};
jQuery.fn.dataTableExt.oSort['date-dd-mmm-yyyy-desc'] = function(a, b) {
"use strict"; //let's avoid tom-foolery in this function
var ordA = customDateDDMMMYYYYToOrd(a),
ordB = customDateDDMMMYYYYToOrd(b);
return (ordA < ordB) ? 1 : ((ordA > ordB) ? -1 : 0);
};
})();
上面的代码是date sort plugin(dd-mmm-yyyy
)的修改。我修改了customDateDDMMMYYYYToOrd
函数以适应这个特定的例子
添加此项,以便插件在日期分类时知道要使用的内容
var tbl = $('#tbl').DataTable({
dom: "<'row'<'col-sm-6 col-xs-7'l><'col-sm-6 col-xs-7'f>>" + "rtip",
order: [[0, "asc"]],
pagingType: "numbers",
pageLength: 50,
columnDefs: [
{ type: 'date-dd-mmm-yyyy', targets: 1 } //add this part
]
});
您可以找到datatable
here
注意:
请注意,此插件已弃用*。 datetime {{3}} 插件提供增强的功能和灵活性
答案 1 :(得分:1)
由于type
等等是有效的RFC2822日期,您所要做的就是将date
列设置为columnDefs: [
{ targets: 1, type: 'date' }
]
:
null
或者,如果数据中有一些奇数值,例如columnDefs: [
{ targets: 1,
type: 'num',
render: function(data,type) {
if (type == 'sort') return Date.parse( data ).valueOf()
return data
}
}
]
值,您只需传回已解析的值并按数字排序,无论如何强制正确排序(我猜这是真正的问题):
data-sort
这里真的不需要特殊的排序插件。第三种选择是将无格式日期设置为自身的<td data-sort="@i.Dated.ToString()">@i.Dated.ToString("dd-MMM-yyyy hh:mm tt")</td>
属性
for paragraph in doc.paragraphs:
for run in paragraph.runs:
if run.font.size == Pt(16):
print(paragraph.text)
答案 2 :(得分:0)
答案 3 :(得分:0)
您可以将以下排序方法添加到选项中,以根据日期和时间进行排序,特别是如果您的时间采用12小时(AM / PM)格式。我使用以下代码,它对我有用:
$('#tableid').DataTable({ "order": [[, 'desc']],//order column in descending order. "columnDefs": [ { "type": "date", "targets": }//date column formatted like "03/23/2018 10:25:13 AM". ], "pageLength": 25 });