jQWidgets Forums

jQuery UI Widgets Forums Grid cellsformatt with FireFox

This topic contains 10 replies, has 2 voices, and was last updated by  todd.cochran 11 years, 6 months ago.

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
  • cellsformatt with FireFox #46219

    todd.cochran
    Participant

    I am having an issue where the cellsformat that I am setting for the columns param does not work properly in Firefox. Everything works great in Chrome. Here is how I have set the columns property:

    “columnsDef”:
    {
    “type”: “data_table”,
    “columns”: [“text”, “datafield”, “width”, “columntype”,”editable”,”cellsformat”],
    “rows”:
    [
    [“File Name”, “FileName”, 100, “textbox”,true,””],
    [“File Size”,”FileSize”, 100, “numberinput”,true,””],
    [“Creation Time”, “CreationTime”, 200, “datetimeinput”,true,”F”],
    [“LastAccess Time”, “LastAccessTime”, 200, “datetimeinput”,true,”d”],
    [“LastWrite Time”, “LastWriteTime”, 200, “datetimeinput”,true,”dd/MM/yyyy hh:mm:ss”]
    ]
    },

    This is an internal data structure that we use in our product. This basically gets turned into an array that looks like this:

    columns[4]['text'] = 'LastWrite Time';
    columns[4]['datafield'] = 'LastWriteTime';
    columns[4]['width'] = 200;
    columns[4]['columntype'] = 'datetimeinput';
    columns[4]['editable'] = true;
    columns[4]['cellsformat' = 'dd/MM/yyyy hh:mm:ss';
    

    This format just does not work in Firefox. It just displays the data in the default datetimeinput format.

    thanks

    cellsformatt with FireFox #46220

    todd.cochran
    Participant

    One other note… this only seems to be an issue when setting the cellsformat for the last column of the grid. I can move the ‘dd/MM/yyyy hh:mm:ss’ to any other column and it works just fine.

    cellsformatt with FireFox #46224

    Peter Stoev
    Keymaster

    Hi todd,

    I suggest you to check whether your datafields array has the “type” member set.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/

    cellsformatt with FireFox #46228

    todd.cochran
    Participant

    the datafields setting for the column in question is name : “LastWriteTime” and type : “date”

    Also, this is only an issue on browsers not named Chrome.

    thanks

    cellsformatt with FireFox #46229

    Peter Stoev
    Keymaster

    Hi todd,

    Ok, then could you send a sample which we can use for testing, because the provided code is not sufficient.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/

    cellsformatt with FireFox #46232

    todd.cochran
    Participant

    That will not be easy as we have the widgets pretty embedded in other javascript. I will get something together shortly. I basically used the source behind this as a template for my code.

    thanks

    cellsformatt with FireFox #46233

    todd.cochran
    Participant

    Looks like the link http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/cellediting.htm?arctic
    did not come through in last post

    cellsformatt with FireFox #46234

    todd.cochran
    Participant

    Not sure how I missed this before but I just noticed this in the javascript console:

    Uncaught TypeError: Cannot call method ‘toString’ of undefined jqxdata.js:7

    not sure if it is related

    And we are using 3.0.3

    cellsformatt with FireFox #46304

    todd.cochran
    Participant

    Peter,
    I have finally nailed down the issue. Not sure if this is a problem with the jqxGrid or not, but here is how to recreate the problem.

    set the datafield to a type of date
    set the columntype to datetimeinput
    set the celssformat to “F”

    Load the data adapter with date that have ‘-‘ in them like 2013-05-10. Firefox complains that this is an invalid date if you were to do something like the following in the initeditor function :

    currDate = new Date(cellvalue);
     console.log(currDate.toDateString()); // this will print out Invalid Date
    

    I did the following in the initeditor funciton:

    
                       this.currParams.columns[i]['initeditor'] =
                            function (row, cellvalue, editor)
                            {
                                var editorParams = {};
                                var newDate;
    
                                if(that.propTransforms.debugMode)
                                {
    
                                    sendToLog('DEBUG',that.id,'cellvalue = ' + cellvalue,'initeditor');
                                    sendToLog('DEBUG',that.id,'that.propTransforms.culture = ' + that.propTransforms.culture,'initeditor');
    
                                }
    
                                    // Set Params that should fire on every init
                                    // TODO: Make this configurable via JSON
    
                                        if( that.propTransforms.hasOwnProperty('culture') &&
                                            that.propTransforms.culture !== '')
                                        {
                                            sendToLog('DEBUG',that.id,'setting culture param','initeditor');
                                            editorParams['culture']  = that.propTransforms.culture;
                                        }
    
                                        editorParams['value']           = ""; // Create value param
    
                                        cellvalue = replaceAll(cellvalue,'-','/');  // Make sure we have '/' so Firefox is happy
    
                                        if(cellvalue === "" || cellvalue === undefined)
                                            editorParams.value = new Date();
                                        else
                                        {
                                            newDate = new Date(cellvalue);
                                            if(newDate.toDateString() !== 'Invalid Date')
                                                editorParams.value = newDate;
                                            else
                                            {
                                                editorParams.value = new Date();
                                                sendToLog('ERROR',that.id,'Invalid Date detected in cell in row number ' + row  +
                                                                          ' with cellvalue = ' + cellvalue,'renderWidget.initeditor');
                                            }
    
                                        }
    
                                editor.jqxDateTimeInput(editorParams);
    
                            };
    

    thanks

    cellsformatt with FireFox #46305

    Peter Stoev
    Keymaster

    Hi Todd,

    That’s normal. currDate = new Date(cellvalue); with 2013-05-10 is an Invalid Date format, because it cannot be parsed by the JavaScript Date object. The String should be converted to a Date object using another approach. In this help topic, you can find how to specify the Format of your Date in the Data Source before loading it into the Grid – http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxgrid/jquery-grid-datasources.htm

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/

    cellsformatt with FireFox #46363

    todd.cochran
    Participant

    Peter,
    I found the issue with the invalid dates. We are pulling data that is assigned to “source” from a database. There was a DATE_FORMAT function being used in the SQL query for one of the columns. Although the date format that was set seems to be a format that is ok for firefox it did not like it. We removed that function and stored just raw date/time data in the database and are now handling all date formatting via the widget. This resolved all the issues.

    thanks

Viewing 11 posts - 1 through 11 (of 11 total)

You must be logged in to reply to this topic.