Question

我正在测试following JSFiddle代码，该代码在Chrome和Firefox中显示有效日期，在IE 11中显示无效日期。

这是我的小提琴代码：

    var data = [
    { name: 'A', date: '07/15/2014 05:00:00.0',des:'This is for A' },
    { name: 'A', date: '08/16/2016 06:00:00.0',des:'This is for 2A' },
    { name: 'A', date: '07/15/2015 07:00:00.0',des:'This is for 3A' },
    { name: 'B', date: '07/15/2016 07:00:00.0',des:'This is for B' },
    { name: 'B', date: '08/16/2016 07:00:00.0',des:'This is for 2B' },
    { name: 'B', date: '09/15/2016 07:00:00.0',des:'This is for 3B' },
    { name: 'C', date: '08/15/2015 07:00:00.0',des:'This is for C' },
    { name: 'D', date: '12/15/2015 07:00:00.0',des:'This is for D' },
    { name: 'E', date: '11/15/2015 07:00:00.0' ,des:'This is for E'}
];

var cl = function (s) { console.log(s); }

var isUsedKey = function (arrayOfObject, key)
{
    for (var i = 0; i < arrayOfObject.length; i += 1)
    {
        if (arrayOfObject[i].key == key)
        {
            return true;
        }
    }

    return false;
};

var array = [];
var object = {};
for (var i = 0; i < data.length; i++)
{
    if (i == 0)
    {
        var newItem = {};
        newItem.key = data[i].name;
        newItem.dates = [data[i].date];
        newItem.description = data[i].des;
        array.push(newItem);
    } else
    {
        var item = data[i];
        var itemName = item.name;
        var itemDate = item.date;
        var itemDesc = item.des;

        if (isUsedKey(array, itemName))
        {
            for (var j = 0; j < array.length; j++)
            {
                if (array[j].key == itemName)
                {
                    var index = array[j].dates.length;
                    array[j].dates[index] = itemDate;
                }
            }
        } else
        {
            var nextNewItem = {};
            nextNewItem.key = itemName;
            nextNewItem.dates = [itemDate];
            nextNewItem.description = itemDesc;
            array.push(nextNewItem);
        }
    }
}

var newSource = {
    localdata: array,
    datafields: [{
        name: 'name',
        type: 'string',
        map: 'key'
    }, {
        name: 'date',
        type: 'date',
        map: 'dates>0'

    },
    {
        name: 'des',
        type: 'string',
        map: 'description'
    }  
    ],
    datatype: "array"
};
var newAdapter = new $.jqx.dataAdapter(newSource);
console.log(newAdapter);

// Adding for dropdown icon

var iconrenderer = function (row, columnfield, value, defaulthtml, columnproperties) {

                console.log("Test for Date Values");
                console.log(value);


                return '<span style="position: relative; width: 100%; margin: 4px; float: ' + columnproperties.cellsalign + ';">' + value + '<img src="https://www.jqwidgets.com/public/jqwidgets/styles/images/icon-down.png" style="position: absolute; right: 5px;" /></span>';


            }

$("#jqxgrid").jqxGrid({
    source: newAdapter,
    editable: true,
    columns: [
    {
        text: 'Name',
        datafield: 'name',
        editable: false,
        width: 100,
        height: 100
    }, 

    {
        text: 'Date',
        datafield: 'date',
        cellsformat: 'd',
        columntype: 'combobox',
        width: 200,
        height: 200,
        cellsrenderer: iconrenderer,
        createeditor: function (row, column, editor)
        {
            var info = $('#jqxgrid').jqxGrid('getrowdata', row);
            var groupName = info.name;
            var dates = [];
            for (var i = 0; i < array.length; i++)
            {
                if (array[i].key == groupName)
                {
                    dates = array[i].dates;
                }
            }

            editor.jqxComboBox({ autoDropDownHeight: true, source: dates, promptText: "Please Choose:" });
        },
        initeditor: function (row, column, editor)
        {
            var info = $('#jqxgrid').jqxGrid('getrowdata', row);
            var groupName = info.name;
            var dates = [];
            for (var i = 0; i < array.length; i++)
            {
                if (array[i].key == groupName)
                {
                    dates = array[i].dates;
                }
            }

            editor.jqxComboBox({
                autoDropDownHeight: true,
                source: dates,
                promptText: "Previous Dates:",
                renderer: function (index_, label_, value_)
                {
                    var formattedDate = "";
                    //if (!isEmpty(value_)) {
                    var dateObject = new Date(value_);
                    formattedDate = (dateObject.getMonth() + 1) + "/" + dateObject.getDate() + "/" + dateObject.getFullYear();
                    //}
                    return formattedDate;
                },
                renderSelectedItem: function (index, item)
                {
                    var records = editor.jqxComboBox('getItems');
                    var currentRecord = records[index].label;
                    var formattedDate = "";
                    //if (!isEmpty(value_)) {
                    var dateObject = new Date(currentRecord);
                    formattedDate = (dateObject.getMonth() + 1) + "/" + dateObject.getDate() + "/" + dateObject.getFullYear();
                    //}
                    return formattedDate;
                }
            });
        },
        cellvaluechanging: function (row, column, columntype, oldvalue, newvalue)
        {
            // return the old value, if the new value is empty.
            if (newvalue == "") return oldvalue;
        },

    },
    {
        text: 'Description',
        datafield: 'des',
        editable: false,
        width: 100,
        height: 100
    }   


    ],
});

这是来自Fiddle的CSS代码：

body {  width: 100%; height: 100%; }

这是来自小提琴的HTML代码：

<div id='jqxWidget'>
    <div id="jqxgrid"></div>
</div>

问题描述：

我在上面的代码中的以下位置添加了两个控制台日志：

var iconrenderer = function (row, columnfield, value, defaulthtml, columnproperties) {

                console.log("Test for Date Values");
                console.log(value);


                return '<span style="position: relative; width: 100%; margin: 4px; float: ' + columnproperties.cellsalign + ';">' + value + '<img src="https://www.jqwidgets.com/public/jqwidgets/styles/images/icon-down.png" style="position: absolute; right: 5px;" /></span>';

Internet Explorer 11（在控制台日志中）由于某种原因显示今天的日期，如下所示：

Chrome和Firefox会显示小提琴中提到的正确日期。以下是chrome的截图：

有谁能告诉我如何在JSFiddle代码中修复IE日期相关问题？

Answer 1

[Invalid Date]消息来自proto函数，这是由于IE的内部实现，所以你不必担心它，从“console.log（value）”替换代码行“console.log（value.toString（））;”

IE 11显示无效日期，chrome / firefox显示正确的日期

1 个答案: