How do I store dates in Sencha Touch 2 Models

Question

In sencha touch 2, it appears there are only string, int, float, boolean data types. How then do I store a datetimes?

UPDATE

OK, I found I can use convert() to convert values: http://docs.sencha.com/touch/2-0/#!/api/Ext.data.Types

convert : Function A function to convert raw data values from a data block into the data to be stored in the Field. The function is passed the collowing parameters:
- v : Mixed
The data value as read by the Reader, if undefined will use the configured defaultValue.
- rec : Mixed
The data object containing the row as read by the Reader. Depending on the Reader type, this could be an Array (ArrayReader), an object (JsonReader), or an XML element.

// Add a new Field data type which stores a VELatLong object in the Record.
Ext.data.Types.VELATLONG = {
    convert: function(v, data) {
        return new VELatLong(data.lat, data.long);
    },
    sortType: function(v) {
        return v.Latitude;  // When sorting, order by latitude
    },
    type: 'VELatLong'
};

But I do not really understand the code. For convert(), what sets the parameters? Why is the 1st param unused and when and what is it used for? How do I get/set such custom types (does it become v or data in convert())?

Answer 1

http://docs.sencha.com/touch/2-0/#!/api/Ext.data.Types-property-DATE Oh hey a date data type...

Anyway, before answering your question! ( see the tl;dr for a date data type example )

http://docs.sencha.com/touch/2-0/#!/api/Ext.data.Field-cfg-convert

A function which converts the value provided by the Reader into an object that will be stored in the Model. It is passed the following parameters:

v : Mixed

The data value as read by the Reader, if undefined will use the configured defaultValue. rec : Ext.data.Model

The data object containing the Model as read so far by the Reader. Note that the Model may not be fully populated at this point as the fields are read in the order that they are defined in your fields array.

Ext.define('Dude', {
    extend: 'Ext.data.Model',
    fields: [
        {name: 'locationInCity',  convert: function(rawDataValue,record){
            return record.location+', '+record.city //would be something like Sprooklyn,Springfield
        }},
        {name: 'firstname', mapping: 'name.first'},
        {name: 'lastname',  mapping: 'name.last'},
        {name: 'city', defaultValue: 'homeless'},
        'state',
        {name: 'location',  convert: location}
    ]
});

Ah and at this point I found the source of your example ;)

// Add a new Field data type which stores a VELatLong object in the Record.
Ext.data.Types.VELATLONG = {
    convert: function(v, data) { // convert(value,record)
        return new VELatLong(data.lat, data.long); //VELatLong was declared previously in another library as something according to example
    },
    sortType: function(v) {
        return v.Latitude;  // When sorting, order by latitude //VELatLong will have lat and long properties, this is for complex sorting
    },
    type: 'VELatLong' //This is what we use to reference it.
};

All this does is declare a new data type more or less. it would look something like

// Add a new Field data type which stores a VELatLong object in the Record.
Ext.data.Types.tehDate = {
    convert: function(v, data) { // convert(value,record)
        return new date(v);
    },
    sortType: function(v) {
        return v; // eh i have no idea whether its going to actually just accept date comparisons, though no there's real reason why it shouldn't
    },
    type: 'tehDate' //This is what we use to reference it.

};

^-- some of this is untested.

TL;DR

Now to actually answer your -original- question:

Ext DOES have a date type you can use: Ext.data.Types.DATE ( as well as a few others ).

I assume type: date didnt work, else we wouldn't be here! So probably only 4 are referenced properly. But! this does work:

var types = Ext.data.Types; // allow shorthand type access
Ext.define('Unit', {
    extend: 'Ext.data.Model',
    config: {
        fields: [
            { name: 'dated', type: types.DATE },
            { name: 'pie', type: 'string' },
        ]
    }
});
abc=Ext.create('Unit',{
    dated: new Date().toString(),
    pie:'hello'
})
console.log(abc)
console.log(abc.get('dated').getUTCFullYear())//it liiiiives!

Fiddle of working code:

http://www.senchafiddle.com/#w97Oe

Answer 2

Just to wrap all above in simple way:

yes, you can easily store dates as Dates in your models. To do that you'll need:

1. to specify type of field in a model (remember to include file Ext.data.Types in required field in your app.js):

   {name: 'date', type: Ext.data.Types.DATE, dateFormat: 'd.m.Y'};
   

2. to use modifiers with date format for that fields in your XTemplates:

   {date:date("d.m.Y")} 
   

3. to correctly convert date field back to string before sending to server. For example, I store dates in format "d.m.Y", so I do the following conversion:

   Ext.Date.format(form.getValues().date, 'd.m.Y').
   

That's it! Now you have all the power of native Date field i.e. you can do grouping, sorting, etc. without hassle.

Answer 3

Sencha Touch 1.0 supports date type in Model.

However, Sencha Touch 2 only supports only 4 data types for Model.

• String
• Integer
• Float
• Boolean

What you can do is you can put your date in String format and then later on convert it into date object using the API's.