This is a migrated thread and some comments may be shown as answers.

Formatting numbers as dates in a grid

4 Answers 555 Views
Grid
This is a migrated thread and some comments may be shown as answers.
John
Top achievements
Rank 1
John asked on 20 Mar 2013, 06:59 PM
Hi

In my rest resource, dates come over as numbers; time in milliseconds.  I'd like to take these numbers and convert them to dates.  I do this in other places using moment (my app uses moment + requirejs + backbonejs)

var m = moment(new Number(value)).format(this.dateTimeFormat);

where the format is here: dateTimeFormat : 'MMM D, YYYY [at] h:mm a',

However, anytime I do this I get an error referring to no such function toLowerCase exists.

Any ideas?

4 Answers, 1 is accepted

Sort by
0
John
Top achievements
Rank 1
answered on 20 Mar 2013, 07:14 PM
Here's a little more info.  Hopefully it helps

In my grid, I have this as a column definition:

{field: "dueDate",title: "Due",width: 200, template:'#= formatDate(dueDate) #'},

Within my render function of my backbone view, I've defined this function:

function formatDate(d) {
return moment(new Number(d)).format('MMM D, YYYY');
}

Note that I've done something very similar for a command button:

function showDetails(e) {
console.log("showing details "+e);
}

{ command: { text: "View Details", click: showDetails }, title: " ", width: "140px" }

Which does fire correctly.  Here's the full error I get:

Uncaught TypeError: Cannot call method 'toLowerCase' of undefined

So I'm assuming that something is null, but not sure what.
0
Alexander Valchev
Telerik team
answered on 22 Mar 2013, 01:29 PM
Hi John,

I am not expert in moment.js however in order to work with dates in Kendo Grid, you should define the type of the corresponding fields in the dataSource.schema.model.fields configuration. 
schema: {
    model: {
        id: "id",
        fields: {
            id: { type: "number" },
            foo: { type: "date" }
        }
    }
}

In this way the dataSource will attempt to transform timestamps into JavaScript Date objects. In case the default parser fails you can parse the data manually in the parse function of the DataSource.

Once dates are parsed and loaded in the dataSource, you can format them via columns.format or columns.template. The approach is demonstrated in this demo.

I hope this will help.

Kind regards,
Alexander Valchev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
John
Top achievements
Rank 1
answered on 22 Mar 2013, 01:32 PM
Hmm ok.  Makes sense.  I'd prefer to be able to use moment to parse and format the date since we're using it all over currently.
0
Alexander Valchev
Telerik team
answered on 22 Mar 2013, 04:28 PM
Hi John,

You should be able to use moment.js to transform timestamps in the parse function of the schema. You can also use moment.js to format the date inside the template, however in the DataSource, date values should be stored as JavaScript Date objects.

Regards,
Alexander Valchev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Grid
Asked by
John
Top achievements
Rank 1
Answers by
John
Top achievements
Rank 1
Alexander Valchev
Telerik team
Share this question
or