1. #1
    Sencha User
    Join Date
    Sep 2010
    Posts
    38
    Vote Rating
    1
    robshim is on a distinguished road

      0  

    Default Date field defaults to 31/01/1900

    Date field defaults to 31/01/1900


    Hi,
    Got a really useful extjs application going - http://www.frimleypark.nhs.uk/confor...onformity.html

    But if you lookk at say 'Date cleared' it says 31/01/1900. It is not allowing the field to be blank.

    Here is the Date cleared code

    dataIndex : 'cleared', xtype : 'datecolumn', header : 'Date cleared', format : 'd/m/Y', width : 80, editor: { xtype : 'datefield', allowBlank : true, format : 'd/m/Y' } },Hope someone can help?

    Thanks,

    Rob

  2. #2
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    92
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    Change your server so it sends '' instead of '0000-00-00' for empty dates.

  3. #3
    Sencha User
    Join Date
    Sep 2010
    Posts
    38
    Vote Rating
    1
    robshim is on a distinguished road

      0  

    Default


    Thanks Condo, I'll give it a try on Monday.

  4. #4
    Sencha User
    Join Date
    Sep 2010
    Posts
    38
    Vote Rating
    1
    robshim is on a distinguished road

      0  

    Default


    Hi,
    Where abouts do I change this? Is it a MySQL setting?
    Thanks,
    Rob

  5. #5
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    92
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    I have no idea where your 0000-00-00 date value is coming from. I don't believe it's stored in the database that way (unless you are using a char field instead of a date or timestamp).

    Another solution would be to set:
    Code:
    Date.useStrict = true;
    to disable date roll-over and correctly detect 0000-00-00 as invalid.

  6. #6
    Sencha User
    Join Date
    Sep 2010
    Posts
    38
    Vote Rating
    1
    robshim is on a distinguished road

      0  

    Default


    Thanks Condor. But where would this bit of code go please?

    //
    // 'grid-example.js' - source file for the grid-example package.
    //
    //
    Ext.onReady(function(){

    // Boilerplate - tell ExtJS we're going to be using 'direct'
    // in 'normal' mode (rather than 'polling')
    //
    Ext.Direct.addProvider(Ext.app.REMOTING_API);
    //
    // This is a small 'hack' to keep track of new records.
    //
    var new_records = Array();

    //return String.format('{0}', val.dateFormat('M j, Y'));
    //}
    // 'hospitals_update' is called by the commit button. It should
    // write any changes to the database then clear the 'changed'
    // flag against successfully written records.
    //
    ///
    var hospitals_update = function() {
    //
    // Always explicitly define variables as local unless
    // you actually want them to be global. Reduces the chance
    // of a namespace conflict with another routine and makes
    // life more convenient when you are using the debugger.
    //
    // Using ONE var statement will keep 'lint' type programs
    // happy although you can use var multiple times if you
    // really want to.
    //
    var modified,index,record,params;
    //
    // 'callback' is activated when the direct function
    // completes. Interrogating response.status will tell you
    // whether the routine was successful or not - see the
    // mydb.php file re; setting 'status'.
    //
    var callback = function(response,e)
    {
    if(!response.status) Ext.Msg.alert("Error",response.text);
    else {
    //
    // If response.status == 1 then we expect
    // to find 'id' set to the record id we
    // just added.
    //
    index = store.find("id",response.id);
    if( index != -1 )
    {
    record = store.getAt(index);
    record.commit();
    }
    //
    // Note, this doesn't work for new records
    // as we're using auto-increment and the
    // record is isn't known until the
    // record has been created.
    //
    }
    }
    //
    // For each new record we've created, generate a config
    // block and call mydb.create.
    //
    for(index=0;index<new_records.length;index++) {
    record = store.getAt(new_records[index]);
    params = { 'name':record.get('name'),'source':record.get('source'),'discipline':record.get('discipline'),'title':record.get('title'),'standards':record.get('standards'),'description':record.get('description'),'raised':record.get('raised'),'whom':record.get('whom'),'remedial':record.get('remedial'),'corrective':record.get('corrective'),'preventative':record.get('preventative'),'bywhen':record.get('bywhen'),'bywhen2':record.get('bywhen2'),'ext':record.get('ext'),'bywho':record.get('bywho'),'cleared':record.get('cleared'),'comments':record.get('comments'),'colCheck':record.get('colCheck'),'status':record.get('status') };
    mydb.create(params,callback);
    }
    //
    // For each changed record, generate a config
    // block and call mydb.create.
    //
    modified = store.getModifiedRecords();
    for(index=0;index<modified.length;index++) {
    record = modified[index];
    params = { 'name':record.get('name'),'source':record.get('source'),'discipline':record.get('discipline'),'title':record.get('title'),'standards':record.get('standards'),'description':record.get('description'),'id':record.get('id'),'raised':record.get('raised'),'whom':record.get('whom'),'remedial':record.get('remedial'),'corrective':record.get('corrective'),'preventative':record.get('preventative'),'bywhen':record.get('bywhen'),'bywhen2':record.get('bywhen2'),'ext':record.get('ext'),'bywho':record.get('bywho'),'cleared':record.get('cleared'),'comments':record.get('comments'),'colCheck':record.get('colCheck'),'status':record.get('status')};
    mydb.update(params,callback);
    }
    //
    // This is a bit of a lazy cheat, if we've added any
    // records, reload the table which will clear the 'modified'
    // status of the new records. To do this properly we should
    // assign temporary / unique id's to records when we add
    // them and ensure the callback can always find new records
    // to clear the status explicitly, rather than relying on
    // a table reload.
    //
    if(new_records.length) {
    store.reload();
    new_records = Array();
    }
    }
    //
    // 'schema' - the structure of our database records
    //
    var schema = [
    { name: 'id' , type: 'int' },
    { name: 'name' , type: 'string' },
    { name: 'source' , type: 'string' },
    { name: 'discipline' , type: 'string' },
    { name: 'title' , type: 'string' },
    { name: 'standards' , type: 'string' },
    { name: 'description' , type: 'string' },
    { name: 'raised' , type: 'date' , dateFormat:'Y-m-d'},
    { name: 'whom' , type: 'string' },
    { name: 'remedial' , type: 'string' },
    { name: 'corrective' , type: 'string' },
    { name: 'preventative' , type: 'string' },
    { name: 'bywhen' , type: 'date' , dateFormat:'Y-m-d'},
    { name: 'bywhen2' , type: 'date' , dateFormat:'Y-m-d'},
    { name: 'ext' , type: 'string' },
    { name: 'cleared' , type: 'date' , dateFormat:'Y-m-d'},
    { name: 'bywho' , type: 'string' },
    { name: 'comments' , type: 'string' },
    { name: 'status' , type: 'string' },
    { name: 'colCheck', type: 'string' }
    ];
    //
    // 'store' - this really is all there is to reading the table
    // from SQL.
    //
    var store = new Ext.data.DirectStore({
    directFn : mydb.read,
    loading : false,
    fields : schema
    });
    //
    // 'editor' - setup / config for the RowEditor plugin
    //
    var editor = new Ext.ux.grid.RowEditor({
    saveText : 'Update'
    });

    var date_editor = new Ext.form.DateField();
    var date_editor2 = new Ext.form.DateField();
    var date_editor3 = new Ext.form.DateField();
    var date_editor4 = new Ext.form.DateField();
    var check_editor = new Ext.form.Checkbox();

    var drop_editor = new Ext.form.ComboBox({
    typeAhead : true,
    triggerAction : 'all',
    lazeyRender : true,
    mode : 'local',
    store : new Ext.data.ArrayStore(
    {
    id : 0,
    fields : [ 'text' ],
    data : [['Mon'],['Tue'],['Wed'],['Thu'],['Fri'],['Sat'],['Sun']]
    }),
    valueField : 'text',
    displayField : 'text'
    });
    var drop_editor2 = new Ext.form.ComboBox({
    typeAhead : true,
    triggerAction : 'all',
    lazeyRender : true,
    mode : 'local',
    store : new Ext.data.ArrayStore(
    {
    id : 1,
    fields : [ 'text' ],
    data : [['Change requests'],['CPA'],['Incidents'],['Internal Audits'],['MHRA'],['Misc'],['NEQAS'],['Process Deviations'],['Winpath']]}),
    valueField : 'text',
    displayField : 'text'
    });

    var drop_editor3 = new Ext.form.ComboBox({
    typeAhead : true,
    triggerAction : 'all',
    lazeyRender : true,
    mode : 'local',
    store : new Ext.data.ArrayStore(
    {
    id : 2,
    fields : [ 'text' ],
    data : [['All'],['B.T. both sites'],['B.T. FPH'],['B.T. RSCH'],['Biochem both'],['Biochem FPH'],['Biochem RSCH'],['Bowel Screening'],['C I Unit'],['Clinical Trials'],['Cytology'],['GMEC'],['Haematology both'],['Haematology FPH'],['Haematology RSCH'],['Histology'],['Immunology'],['Microb Bacty'],['Microb Virology'],['Microbiology'],['Molecular Diagnostics'],['Mortuary'],['Peptides'],['POC'],['POC EQA'],['Q.M. & All'],['Quality Managers'],['SAS Peptides'],['SAS Peptides EQA'],['SPOT team'],['Support Services'],['Trace Elements'],['Trace Elements EQA']]}),
    valueField : 'text',
    displayField : 'text'
    });
    function do_delete(b,e)
    {
    Ext.Msg.show({
    title : 'Confirmation',
    msg : 'DELETE this record<br/><br/>Are you sure?',
    fn : function(btn,text)
    {
    if( btn == "yes" ) {
    var callback = function(response,e)
    {
    if(!response.status) Ext.Msg.alert("Error",response.text);
    else {
    Ext.Msg.alert('Deleted','Record deleted');
    }
    }
    var record = grid.getSelectionModel().getSelected();
    params = { 'id':record.get('id'),'name':record.get('name') };
    mydb.delet(params,callback);
    store.remove(record);
    store.reload();
    }
    },
    buttons : Ext.Msg.YESNO,
    icon : Ext.MessageBox.QUESTION
    });
    }
    //
    // 'grid' - this does all the GUI work
    //
    var grid = new Ext.grid.GridPanel({
    store : store,
    region : 'center',
    margins : '0 5 5 5',
    stripeRows : true,
    //autoExpandColumn: 'name',
    width : 50,
    plugins : [editor],
    columns : [
    { id : 'id' ,
    header : 'No' ,
    editable: false,
    width : 30,
    dataIndex : 'id',
    editor : { xtype:'textfield',allowBlank:true }
    },
    { id : 'name',
    header : 'Ref No',
    width : 40,
    dataIndex : 'name',
    editor : { xtype:'textfield',allowBlank:true }
    },
    { id : 'source',
    header : 'Source',
    width : 80,
    dataIndex : 'source',
    editor : drop_editor2
    },
    { id : 'discipline',
    header : 'Discipline',
    width : 100,
    dataIndex : 'discipline',
    editor : drop_editor3
    },
    { id : 'title',
    header : 'Title',
    width : 55,
    dataIndex : 'title',
    editor : { xtype:'textfield',allowBlank:true }
    },
    { id : 'standards',
    header : 'Standards',
    width : 60,
    dataIndex : 'standards',
    editor : { xtype:'textfield',allowBlank:true }
    },

    { id : 'description',
    header : 'Description',
    width : 150,
    height : 100,
    dataIndex : 'description',
    editor : { xtype:'textarea',maxLength:150,maxLengthText: 'max 150 characters',allowBlank:true }
    },


    { id : 'raised',
    header : 'Date raised',
    width : 80,
    dataIndex : 'raised',

    //renderer: renderDate,
    allowBlank : true,
    editor : date_editor

    },
    //Working date format!//
    //{dataIndex : 'raised',
    //xtype : 'datecolumn',
    //header : 'Raised',
    //format : 'd/m/Y',
    //width : 100,
    //editor: {
    //xtype : 'datefield',
    //allowBlank : true,
    //format : 'd/m/Y'
    //}
    //},

    { id : 'whom',
    header : 'By whom',
    width : 60,
    dataIndex : 'whom',
    editor : { xtype:'textfield',allowBlank:true }
    },

    { id : 'remedial',
    header : 'Remedial action',
    width : 150,
    dataIndex : 'remedial',
    editor : { xtype:'textarea',maxLength:150,maxLengthText: 'max 150 characters',allowBlank:true }
    },
    { id : 'corrective',
    header : 'Corrective action',
    width : 150,
    dataIndex : 'corrective',
    editor : { xtype:'textarea',maxLength:150,maxLengthText: 'max 150 characters',allowBlank:true }
    },

    { id : 'preventative',
    header : 'Preventative action',
    width : 150,
    dataIndex : 'preventative',
    editor : { xtype:'textarea',maxLength:150,maxLengthText: 'max 150 characters',allowBlank:true }
    },
    { id : 'bywhen',
    header : 'When 1st action',
    width : 100,
    dataIndex : 'bywhen',
    //renderer: renderDate,
    editor : date_editor2

    },
    { id : 'bywhen2',
    header : 'When 2nd action',
    width : 100,
    dataIndex : 'bywhen2',
    //renderer: renderDate,
    editor : date_editor4

    },
    { id : 'ext',
    header : 'Ext',
    width : 60,
    dataIndex : 'ext',
    editor : { xtype:'textfield',allowBlank:true }
    },
    { id : 'bywho',
    header : 'By who',
    width : 60,
    dataIndex : 'bywho',
    editor : { xtype:'textfield',allowBlank:true }
    },
    { id : 'cleared',
    header : 'Date cleared',
    width : 80,
    dataIndex : 'cleared',
    //renderer: renderDate,
    editor : date_editor3

    },
    { id : 'comments',
    header : 'Comments',
    width : 150,
    dataIndex : 'comments',
    editor : { xtype:'textarea',maxLength:150,maxLengthText: 'max 150 characters',allowBlank:true }
    },

    //OLD check format { id : 'colCheck',
    //header : 'Complete?',
    //width : 60,
    //dataIndex : 'colCheck',
    //editor : check_editor
    //}
    {
    xtype : 'booleancolumn',
    id : 'colCheck',
    header : 'Complete',
    width : 60,
    dataIndex : 'colCheck',
    align : 'center',
    trueText : 'Yes',
    falseText : 'No',
    editor: {
    xtype : 'checkbox'
    }
    }
    ],
    tbar : [
    {
    text : 'Add record',
    handler : function() {
    var h,Hospital;
    //
    // Create a new / blank hospital record
    //
    Hospital = Ext.data.Record.create(schema);
    h = new Hospital({
    name : 'Ref no?'
    });
    //
    // Make sure the editor isn't active
    //
    editor.stopEditing();
    //
    // Add it to the grid and mark as dirty
    //
    store.add(h);
    h.markDirty();
    grid.getView().refresh();
    //
    // Add to our array of new records
    //
    new_records.push(store.indexOf(h));
    }
    },{
    text : 'Delete',
    handler : do_delete
    },{
    //
    // This is the 'commit' button together with it's
    // handler, i.e. just call hospitals_update
    //
    text : 'Save',
    handler : hospitals_update
    }]
    });
    //
    // Just an envelope, you could embed the grid directly if you wish
    // but this is handy for readability.
    //
    var layout = new Ext.Panel({
    title : 'Non Conformity Record',
    layout : 'border',
    layoutConfig : { columns: 1 },
    width : 1740,
    height : 520,
    items : [ grid ]
    });

    // Render the grid, 'then' load the table, decreases the dead time
    // before the user sees something.
    //
    layout.render('grid-example');
    store.load();
    var exportButton = new Ext.ux.Exporter.Button({
    component: grid,
    text : " Download as .xls"
    });
    grid.getTopToolbar().add(exportButton);

    });
    //finally, remove the loading mask
    (function(){
    Ext.get('loading').remove();
    Ext.get('loading-mask').fadeOut({remove:true});
    }).defer(250);

  7. #7
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    92
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    After including ext-all.js and before Ext.onReady.

  8. #8
    Sencha User
    Join Date
    Sep 2010
    Posts
    38
    Vote Rating
    1
    robshim is on a distinguished road

      0  

    Default


    I'm sorry I don't get you. Is this somewhere on grid-example.js?

  9. #9
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    92
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    What's the problem?

    I simply meant:
    Code:
    Date.useStrict = true;
    Ext.onReady(function(){
      ...
    });

  10. #10
    Sencha User
    Join Date
    Sep 2010
    Posts
    38
    Vote Rating
    1
    robshim is on a distinguished road

      0  

    Default


    Thanks, that works. This is terrific technology but tricky to get to work.
    I have made two pages, a 'read only' view and an admin 'edit' view. The admin edit page has stopped working in IE, it just fails to load. Any suggestions?
    Thanks,
    Rob

Similar Threads

  1. using field.markInvalid() always defaults to 'side'
    By JeanNiBee in forum Ext 3.x: Help & Discussion
    Replies: 1
    Last Post: 16 Feb 2010, 3:15 AM
  2. How to change date format after a date field has been created?
    By lensesby in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 3 Mar 2009, 7:11 AM
  3. Week Number in Date field / Date Packer
    By speedytangent in forum Ext 2.x: Help & Discussion
    Replies: 4
    Last Post: 15 Oct 2008, 2:01 AM
  4. Newbie Question about disable shadow of the date picker's date field
    By fm424946 in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 13 Nov 2007, 9:02 AM

Thread Participants: 2