在jquery数据表中显示之前,将json日期格式化为mm / dd / yy格式

时间:2015-02-26 02:47:53

标签: jquery json date datatables

我正在尝试在数据表中显示一些数据,而我正在使用的表脚本是

$('#userData').dataTable({

        "ajax": {
                "url": "${rc.getContextPath()}/module/roles/users-list",
                "dataSrc":  "",
                },

        "columns":[
        {"data": "userId"},
        {"data": "applicationId"},
        {"data": "username"},
        {"data": "firstName"},
        {"data": "userCreated"},
        {"data": "createdTime"},
        {"data": "updatedTime"}
        ],

     });

表格收到的数据是json,类似于

[
 {  
      "userId":179,
      "applicationId":"pgm-apn",
      "username":"collaborator.user3",
      "password":"password1",
      "email":"user@xample.com",
      "firstName":"Anthony",
      "lastName":"Gonsalves",
      "enabled":true,
      "userCreated":"sitepmadm",
      "userModified":"sitepmadm",
      "createdTime":1422454697373,
      "updatedTime":1422454697373
   },
   {  
      "userId":173,
      "applicationId":"pgm-apn",
      "username":"consumer.user",
      "password":"password1",
      "email":"test@egc.com",
      "firstName":"sherlock ",
      "lastName":"homes",
      "enabled":true,
      "userCreated":"sitepmadm",
      "userModified":"sitepmadm",
      "createdTime":1422010854246,
      "updatedTime":1422010854246
   }

我想将日期显示为正确的日期时间。目前它在json数据中显示为相同的sting。有没有办法在数据表中转换它

8 个答案:

答案 0 :(得分:35)

您可以使用“渲染”属性设置列显示格式http://datatables.net/reference/option/columns.render#function

例如:

{
    "data": "createdTime",
    "render": function (data) {
        var date = new Date(data);
        var month = date.getMonth() + 1;
        return (month.length > 1 ? month : "0" + month) + "/" + date.getDate() + "/" + date.getFullYear();
    }
}

答案 1 :(得分:18)

对于可以为空的日期时间DateTime ?,您将需要使用不同的渲染函数:

        $('#userData').DataTable({
        columns: [
            { "data": "userId"},
            {"data": "userCreated",
             "type": "date ",
             "render":function (value) {
                 if (value === null) return "";

                  var pattern = /Date\(([^)]+)\)/;
                  var results = pattern.exec(value);
                  var dt = new Date(parseFloat(results[1]));

                  return (dt.getMonth() + 1) + "/" + dt.getDate() + "/" + dt.getFullYear();}
            }
        ]};

答案 2 :(得分:6)

我使用moment js创建了demo,并使用render函数将json数据转换为所需的格式。

jsfiddle demo

还可以找到以下代码:

testdata = [{
    "id": "58",
        "country_code": "UK",
        "title": "Legal Director",
        "pubdate": "1422454697373",
        "url": "http://..."
}, {
    "id": "59",
        "country_code": "UK",
        "title": "Solutions Architect,",
        "pubdate": "1422454697373",
        "url": "http://..."
}];

$('#test').dataTable({
    "aaData": testdata,
        "aoColumns": [{
        "mDataProp": "id"
    }, {
        "mDataProp": "country_code"
    }, {
        "mDataProp": "title"
    }, {
        "mDataProp": "pubdate"
    }, {
        "mDataProp": "url"
    }],
        "columnDefs": [{
        "targets": 3,
            "data": "pubdate",
            "render": function (data, type, full, meta) {
                console.log('hi...');
            console.log(data);
                console.log(type);
                console.log(full);
                console.log(meta);
            return moment.utc(data, "x").toISOString();
        }
    }]
});

答案 3 :(得分:1)

在处理js中的日期时,我总是使用moment.js(http://momentjs.com/)。

返回的日期值在unix时间戳中,因此您需要转换它们。

以下是一个示例小提琴:http://jsfiddle.net/fws8u54g/

var created = 1422010854246;
moment.utc(created, "x").toISOString();

答案 4 :(得分:1)

对于dot.net和javascript,你可以像@David Sopko一样使用

 {
                "data": "Date", "type": "date ",
                "render": function (value) {
                    if (value === null) return "";
                    var pattern = /Date\(([^)]+)\)/;//date format from server side
                    var results = pattern.exec(value);
                    var dt = new Date(parseFloat(results[1]));

                    return dt.getDate() + "." + (dt.getMonth() + 1) + "." + dt.getFullYear();
                }, "autoWidth": true
            },

答案 5 :(得分:1)



Caused by: java.lang.ClassNotFoundException: com.ibm.mq.jms.MQQueueConnection
        at java.net.URLClassLoader.findClass(URLClassLoader.java:381)
        at java.lang.ClassLoader.loadClass(ClassLoader.java:424)
        at java.lang.ClassLoader.loadClass(ClassLoader.java:357)




答案 6 :(得分:0)

要显示时间和日期,请添加以下代码:

"data": 'Date' , 
                        "render": function (data) {
                            var date = new Date(data);
                            var month = date.getMonth() + 1;
                            return (month.length > 1 ? month : "0" + month) + "/" + date.getDate() + "/" + date.getFullYear() + "&nbsp;&nbsp;" +(date.getHours() < 10 ? ("0"+date.getHours()) : date.getHours())+ ":"+(date.getMinutes() < 10 ? ("0"+date.getMinutes()) : date.getMinutes()) ; 
                            //return date;
                        }

答案 7 :(得分:0)

@Suraj Gulhane——你的答案是我唯一可以为 ASP.NET Core 服务器端 jQuery DataTables DateTime 格式工作的答案。

我对其进行了一些自定义(基本上删除了时间,将年份放在首位)但这是它的外观,以防对其他人有帮助:

{
  "data": "dateOfBirth", "name": "Date Of Birth", "type": "date",
  "render": function (data) {
    var date = new Date(data);
    var month = date.getMonth() + 1;
    var day = date.getDate();
    return date.getFullYear() + "/" 
       + (month.length > 1 ? month : "0" + month) + "/" 
       + ("0" + day).slice(-2);
       //return date format like 2000/01/01;
    }, "autoWidth": true
}