BootStrap DataTable 时间日期列排序

BootStrap框架中 DataTable表头列中含有排序方法,当列为日期时,日期格式为dd/MM/yyyy,排序会发生混乱,如下图:
在这里插入图片描述DataTable表格是默认按日期最前面的天排序,导致日期排序全部混乱。

这时候我们在日期列中加上日期yyyy/MM/dd格式数据,这时候DataTable表格是默认排序就会以yyyy/MM/dd格式日期正常排序,如下:

@model List<JSDataTable.Models.People>
@{
    ViewBag.Title = "_AssetPartial";
}
<script src="~/Content/JS/jquery-2.1.1.js"></script>
<link href="~/Content/Css/bootstrap.min.css" rel="stylesheet" />
<link href="~/Content/Css/datatables.min.css" rel="stylesheet" />
<link href="~/Content/Css/animate.css" rel="stylesheet" />
<script src="~/Content/JS/bootstrap.min.js"></script>
<script src="~/Content/JS/datatables.min.js"></script>
<br><br>
<table class="table table-bordered table-hover dataTable" id="tblnotifyme" style="width: 100%; margin-top: 10px">
    <thead style="font-weight: bold">
        <tr>
            <th class="text-center">
                ID
            </th>
            <th class="text-center">
                Name
            </th>
            <th class="text-center">
                Address
            </th>
            <th class="text-center">
                Description
            </th>
            <th class="text-center">
                BirthDay
            </th>
            <th class="text-center">
                UpdatedDate
            </th>
        </tr>
    </thead>
    <tbody>
        @if (Model != null && Model.Count > 0)
        {
            foreach (var i in Model)
            {

                #region yyyy/MM/dd格式转化
                string HiddenstrBirthDay;
                if (i.BirthDay != null)
                {
                    DateTime dtBirthDay = (DateTime)i.BirthDay;
                    HiddenstrBirthDay = dtBirthDay.ToString("yyyyMMdd");  //yyyyMMddHHmmss
                }
                else { HiddenstrBirthDay = ""; }

                string HiddenstrUpdatedDate;
                if (i.UpdatedDate != null)
                {
                    DateTime dtUpdatedDate = (DateTime)i.UpdatedDate;
                    HiddenstrUpdatedDate = dtUpdatedDate.ToString("yyyyMMdd");
                }
                else { HiddenstrUpdatedDate = ""; }
                #endregion

                <tr>
                    <td class="text-center">@i.ID</td>
                    <td class="text-center">@i.Name</td>
                    <td class="text-center">@i.Address</td>
                    <td class="text-center">@i.Description</td>
                    <td class="text-center"><a style="display:none">@HiddenstrBirthDay</a>  @string.Format("{0:dd/MM/yyyy}", @i.BirthDay)</td>            @*以a标签包裹*@
                    <td class="text-center"><a style="display:none">@HiddenstrUpdatedDate</a>  @string.Format("{0:dd/MM/yyyy}", @i.UpdatedDate)</td>    @*以a标签包裹*@

                </tr>
            }
        }
    </tbody>
</table>
<script type="text/javascript">
    $(document).ready(function () {
        $("#tblnotifyme").DataTable({
            "iDisplayLength": 25,
            "aaSorting": [[0, "desc"]]
        });
    });
</script>

下面就可以正常排序了
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

-小龙人

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值