DateTime format is initially different than editing format

[alesParticipant]

I use this definition for one of my column:
columntype: 'datetimeinput', cellsformat: 'dd.M.yyyy HH:mm:ss'

When the grid cell is initially displayed, it contains text ‘14.07.2014 00:00:00.000’. Then I click to the cell, a datetime editor is displayed and it shows text ‘14.07.2014 00:00:00’ (this is fine, because the cellsformat is ‘dd.M.yyyy HH:mm:ss’). When I click outside of the cell, editing is finished and the cell displays text ‘14.07.2014 00:00:00’.

Why the cellsformat is not respected in the initial display of the value? What should I do to display the text ‘14.07.2014 00:00:00’ also before the first edit?

Thank you for your help.
Ales

[Peter StoevKeymaster]

Hi Ales,

The provided information is not sufficient for testing your application scenario. Please, provide http://jsfiddle.net/ example which illustrates your scenario. As a suggestion, look at: http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxgrid/jquery-grid-datasources.htm. Sometimes for Dates it is necessary to specify the “format” setting of the datafield as well. The “type” setting should be set to “date”, too.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[alesParticipant]

I have prepared jsfiddle example here: http://jsfiddle.net/bTur4/. Please, look at it.

[alesParticipant]

I have got it. The problem was that the json data were not formatted property. The format of the date was wrong: “15.10.2014 00:00:00.000”. When the source data were “2014-10-15T00:00:00.000Z”, the behavior is correct.

But there is another problem: after saving data to the database, the saved row is returned back to the client (there can be some db triggers, that can modify saved data for example). The returned row is then pushed to grid via “updaterow” method (see below). Everything is fine except the datetime fields. They are not formatted properly and show ‘2014-10-15T00:00:00.000Z’ value.

           $.ajax({
                dataType: 'json',
                type: 'POST',
                url: url,
                cache: false,
                data: data,
                success: function(data, textStatus, jqXHR){
                  $("#main_jqxGrid").jqxGrid('updaterow', currentScope.objectsToSave[i], data);
                  $('#main_jqxGrid').jqxGrid('refreshdata');
                }
            });

Where is the problem, please?

Ales

[Peter StoevKeymaster]

Hi Ales,

I suppose that the problem is that you pass your date as a string where a JavaScript Date object is expected.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[alesParticipant]

Sending date as Java Script Date Object works, when I prepare the data manually. In a real world I use Play Framework as a server and I am able to convert the Java Date object to JSON only as number or ISO date string. Converting to “new Date(1310669017000)” without quotation marks is not possible (at least I do not know how to do it in Play Framework’s JSON library).

Why is it not possible to send date as string in ISO format? Or could you process the dates as numbers? It seems that you already are able to recognize numbers as dates and that there is only a problem in the “updaterow” method – see http://jsfiddle.net/6VWdZ/4/ – Mary has her date ok but Peter not (it is set via “updaterow”). Would you repair the “updaterow” method, please?

Ales

[alesParticipant]

Did you see the example http://jsfiddle.net/6VWdZ/4/?

[Peter StoevKeymaster]

Hi ales,

What should we update/repair? The Grid works with JavaScript Date objects. This means that when you update the value of a cell/row, you should pass a JavaScript Date object to the Date column, not a String, Number or something else.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[alesParticipant]

Hi Peter,
I mean, that the behaviour of the grid is inconsistent in regard of dates, because if the date is initially set in the localdata as Number (see “Mary” in the localdata definition http://jsfiddle.net/6VWdZ/4/), it is displayed properly. But when the date is set as Number in the updaterow method, it is not displayed properly (see “Peter” in the example).

Ales

[Peter StoevKeymaster]

Hi Ales,

As far as I know, the “updaterow” method is called by the developer and the Object passed in as parameter of the “updaterow” method is also prepared by the developer. I do not think that the Grid should validate your data when you pass it. It is clear that you can prepare the data in the format which you wish and then call “updaterow”.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[alesParticipant]

You are right. I receive the data from the Play framework server and I am not able to change the date fields format. I will try to convert it via JavaScript on the client site, but this is not very “clean” solution, IMHO.

Thank you for your assisting.
Ales

[wuuemmParticipant]

Nonsense, Peter, sorry, it sucks. If I once define the date format for a column and it works on initial data binding, I want all subsequent row updates (same item data format from server) to be formatted as defined while a grid was created. The argument “the method is called by the developer” is ridiculous, as all methods are called by developers. You’ve provided properties for formatting when data is initially bound but forgot to apply them when a single row/item is updated. This is the point.

[wuuemmParticipant]

When grid is an jqxGrid element and data is an item

$.each(source._source.datafields, function (i, e) {
    if (e.type === 'date') {
      data[e.name] = source.formatDate(new Date(data[e.name]), 'dd/MM/yyyy HH:mm');
    }
  });
grid.jqxGrid('updaterow', id, data);

This works. Why not include this in the library?
The date format is arbitral here, should get info from grid columns definition in general solution.
The date format coming from server is a timestamp (number).

[Author]

Posts