jqxGrid, jxqDateTimeInput & format problems

[jas-Member]

I have run into a problem when using the ‘datetimeinput’ column type. Example config…

{ text: 'EOWD',
  datafield: 'EOWD',
  width: '10%',
  columntype: 'datetimeinput',
  filtertype: 'date',
  initeditor: function(row, column, editor) {
    var d = new Date()
    _d = [d.getMonth()+1, d.getDate(), d.getFullYear()].join('/');
    editor.jqxDateTimeInput('setDate', _d, {
      formatString: 'MM/dd/yyyy',
      animationType: 'fade',
      width: '150px',
      height: '25px',
      dropDownHorizontalAlignment: 'right'
    })
  },
  validation: function(cell, value) {
    return valDate(value);
  }
},

The format is always a UTC format

[Peter StoevKeymaster]

Hi jas-,

The cellsformat property of the column specifies the column’s format. The editor’s format should be set in the editor’s createeditor callback and of course make sure that when you initialize a datetime datafield, you set its “type” to “date”, too.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[jas-Member]

Hello Peter,

Thanks for the prompt response. I understood the ‘cellsformat’ option and have set this to the appropriate value (I.E. cellsformat: ‘MM/dd/yyyy’) which has resolved the display format for the cell in question.

However upon initialization of the ‘validation’ event (I.E. valDate(value), in this case) the value is passed as a UTC format. I am assuming the ‘initeditor’ callback in the example above is not correct and I must also specify the same format within the ‘createeditor’ callback? Could you perhaps show an example of this? Thanks in advance.

[Peter StoevKeymaster]

Hi jas-,

The editor’s format is synchronized with the column’s format. It is not necessary to set it. The value is passed as JavaScript Date object. It is not necessary to call setDate during the editor’s initialization, too. The editor’s date defaults to the cell’s value.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[jas-Member]

Fair enough, I wasn’t aware of the JS Date Object so I simply modified the contents of the ‘valDate()’ function I am using to ensure the client side column validation is accurate to the following…

function valDate(obj)
{
	/* attempt to correct date format */
	if (!/^[0-9]{1,2}\/[0-9]{1,2}\/[0-9]{4}$/.test(obj)){
		var d = new Date()
		obj = [d.getMonth()+1, d.getDate(), d.getFullYear()].join('/');
	}
	return (/^[\d+]{1,2}\/[\d+]{1,2}\/[\d+]{4}$/.test(obj)) ?
		true : {result: false, message: 'Date is invalid [mm/dd/yyyy]' }
}

[Author]

Posts