Again about dates formatting through moment.min.js and datetime.js

Alex81

Hi all,
although I have considered all the possible answer already given to my issue, it seems that the most classical setting does not work in my case.

Given this:
`

`

And given that the date field within my xml data base file is as follows:
<date1>2005-02-18</date1>

I cannot understand why the following code gives an "Invalid date" as result in the targeted dates column:
Hi all,
although I have considered all the possible answer already given to my issue, it seems that the most classical setting does not work in my case.

Given this:
`

`

And given that the date field within my xml data base file is as follows:
<date1>2005-02-18</date1>

I cannot understand why the following code gives an "Invalid date" as result in the targeted dates column:

          $(document).ready( function () {
              var table = $('#myexample').DataTable( {
                columnDefs: [ {
                  targets: 5,
                  render: $.fn.dataTable.render.moment('YYYY-MM-DD','DD/MM/YY' )
                } ]
              } );
            } );

Many thanks!

Alex81

I cannot edit my post anymore!!!

Alex81

This is the almost correct original post...

Hi all,
although I have considered all the possible answer already given to my issue, it seems that the most classical setting does not work in my case.

Given the use of moment.min.js and datetime.js

And given that the date field within my xml data base file is as follows:
<date1>2005-02-18</date1>

I cannot understand why the following code gives an "Invalid date" as result in the targeted dates column:

          $(document).ready( function () {
              var table = $('#myexample').DataTable( {
                columnDefs: [ {
                  targets: 5,
                  render: $.fn.dataTable.render.moment('YYYY-MM-DD','DD/MM/YY' )
                } ]
              } );
            } );

Many thanks!

kthorngren

Your code seems to work here:
http://live.datatables.net/pejilida/1/edit

Please provide a link to your page or a test case replicating the issue.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

Alex81

Thanks kthorngren,
but as I use eXist-db for developing an intranet, a link to the original page has to be excluded. I don't see neither how to provide a test case which could be different from your minimal one, without involving the specific architecture entailed by eXist-db, which seems quite complicate to be reproduced...

Anyway, basically what happens is that trhough an xquery data are extracted from an xml file and the html page with the table is built.

kthorngren

Does the cell contain <date1>2005-02-18</date1> or 2005-02-18? If it has the date1 tag then you will need to remove that.

the html page with the table is built.

Can you grab a sample of the HTML table to provide or update my test case?

Kevin

Alex81

The table cell contains only the date without the xml tag. Indeed if I do not endeavor to apply the render command through the function, then the date is correctly displayed as 2005-02-18.

However looking at the final html code produced by the xquery, I now see that in the date cells already appears the "Invalid date". Something that would correspond, if I'm not mistaken, to have the "Invalid date" written within the cell in your example, instead of the 2005-02-18. So I think there's no point even in updating your example...

This is my final html code:

<tr class="odd">
    <td>Accumulatori RUAL</td>
    <td>impianti</td>
    <td>UT</td>
    <td>Invalid date</td>
    <td></td>
    <td>Invalid date</td>
</tr>

Alex81

As I can use xquery within the html code, I have tried to change the date format through the following xquery (that works), but then again, applaying the rendering function, the result is an "Invalid date". And if I do not apply the function, then the column ordering is applied to the new format as it were a string and not a date (whereas if I leave the original 2005-02-18 cell's content is ordered as date)...
<td>
{
let $day:=substring($riga/data2,9,2)
let $month:=substring($riga/data2,6,2)
let $year:=substring($riga/data2,1,4)
return
concat($day,'-',$month,'-',$year)
}
</td>

kthorngren

Sorry I should have been more clear. Looks like you are creating a DOM sourced table then initializing Datatables against that. Temporarily remove the Datatables initialization and look at the raw HTML.

The plugin you are using is using moment.js to format the dates. The invalid date is coming from momnet.js. That suggests the cell data has other data than 2005-02-18. One option is to temporarily replace the datetime renderer with columns.render and look at the data in the column using console.log or the browser's debugger, something like this:

      columnDefs: [ {
        targets: 5,
        ///render: $.fn.dataTable.render.moment('YYYY-MM-DD','DD/MM/YY' )
        render: function ( data, type, row, meta ) {
          console.log('"' + data + '"');
          return data;
        }

      } ]

Kevin

Alex81

OK, may be we are on the right way. I was misled by looking at the <td> with the "Invalid date" text, because indeed when the rendering is not applied what appears to be the content of the <td> tag is instead:

<td>
    <data1>1992-11-25</data1>
</td>

So, how to get rid of the tag <data1> from what moment.js gives as result?
Thanks
Alex

kthorngren

Unless you need the data1 tags for something else I would consider removing them in your server script. Maybe the appear in all the columns and you don't need them. Otherwise use columns.render to remove the tags using regex and then use moment.js directly to display in the format you want.

Kevin

Alex81

Hi Kevin!
The following code works (the xml tags are correctly taken away from within the <td> tags), except that the ascending/descending re-ordering of the columns in the dataTable still works on the dates treated only as strings and not as dates (and having them ordered as dates was my final goal)...

$(document).ready( function () {
          var table = $('#myexample').DataTable( {
            columnDefs: [ {
              render: function(data) {
                    var regex = /( |<([^>]+)>)/ig;
                    var mydate = data.replace(regex, "");
                    return moment(mydate).format('DD/MM/YYYY');
                  },
                  targets: [3,5]
            } ]
          } );
        } );

Alex81

And the strange thing is that if I leave things untouched (no use of the rendering function), although the <td> tags contain the xml tags (<data1>), the dates within the colums of the dataTables happen to be ordered as proper dates (!?!).

kthorngren

Use the technique in this blog to sort the dates.

Kevin