Threaded View

  1. 5 Feb 2013 2:22 AM #1
    RSSoll
    RSSoll is offline
    Sencha User
    Join Date
    Feb 2013
    Posts
    10
    Vote Rating
    0
    Answers
    1
    RSSoll is on a distinguished road
      0  

    Default Answered: Date as day, month, year fields

    Answered: Date as day, month, year fields


    Hi!
    I have database which stores dates as three integer fields 'day', 'month' and 'year'. I use ExtJS to present this to the user and would like to use this awesome datepicker. I tried to have a model with field 'date' by using convert method and also by overriding getters and setters, non of this worked. It appears that convert works only one way (it works great for parsing data from server but that's all, i can't save changes) and setters are never used so that the changes do not persist. Is there a way to change these three fields into one and vice versa using ExtJS or should I just do it manually on server side application?
    Code:
    Ext.define('App.model.ModelWithDate', {
    extend: 'Ext.data.Model',

    fields: [
        {name: 'day', type: 'int'},
        {name: 'month', type: 'int'},
        {name: 'year', type: 'int'},
        {name: 'date' , type: 'date', convert: convertDate, persist: false}
   ],
    applyDate: function(date) {
        alert(JSON.stringify(date));
        this.year = date.getYear();
        this.month = date.getMonth();
        this.day = date.getDay();
    },


    getDate: function() {
        alert(this);
        return new Date(this.year, this.month, this.day, 0, 0, 0, 0);
    },


    setDate: function(date) {
        alert(JSON.stringify(date));
        this.year = date.getYear();
        this.month = date.getMonth();
        this.day = date.getDay();
    }
});
function convertDate(v, record){
    alert(JSON.stringify(record.data));
    return new Date(record.data.year, record.data.month, record.data.day, 0, 0, 0, 0);
}
    Reply With Quote Reply With Quote
  2. Best Answer Posted by RSSoll

    Thanks for the answer!
    I tried to use convert on 'date' and serialize on 'day', 'month', 'year'. Unfortunately, when 'date' had 'persist: false' and it was the only thing changed, there wasn't event raised to write changes to the base (although I wanted to change 'day', 'month', 'year' based on 'date'). Code sample:
    Code:
            {name: 'day', type: 'int',
             serialize: function( value, record ){
                    return record.data.date.getFullDate();
         }},
        {name: 'month', type: 'int',
             serialize: function( value, record ){
                    return record.data.date.getFullMonth();
         }},
        {name: 'year', type: 'int',
             serialize: function( value, record ){
                    return record.data.date.getFullYear();
         }},
        {name: 'date', persist: false,
            convert: function( value, record ){
                    return new Date(record.data.year, record.data.month, record.data.day);
            }
        }
    But! Thanks to further investigation I happened to notice that 'convert' had value as an empty string when data was given from database and a date string when it was given from a form (unless form was not properly filled). This way I can distinguish filling form and getting data from database and have a two way convert. I believe it is a workaround but for the time being it is the best solution I could find. Still have to work on nullable date in forms though (probably check whether the date was already filled will be sufficient).
    Thanks for help! If no one wants to share better solution we can close this thread

    Code sample of my solution:
    Code:
            {name: 'day', type: 'int'},
        {name: 'month', type: 'int'},
        {name: 'year', type: 'int'},
        {name: 'date', persist: false,
            convert: function( value, record ){
                if (value == "")
                {
                    return new Date(record.data.year, record.data.month, record.data.day);
                }
                else {
                    var date = new Date(value);
                    record.set('day', date.getDate());
                    record.set('month', date.getMonth());
                    record.set('year', date.getFullYear());
                    return date;
                }
            }
        }

Tags for this Thread