EXTJS Problem with date field please help - json

Question

i'm having trouble trying to figure out how this is happening. i'm using Extjs and AJAX with JsonStore from my callback my page in ASP call the database and return some fields in this fields there is a Date and this date return the proper date ex.: "date_creat_post": "29\u002F04\u002F2011"...
Now once i look at my output from this in my page in a datagrid i'm getting the following:
04/05/2013 <----> the date it return in the callback is 04/05/2011
06/05/2012 <----> the date it return in the callback is 06/05/2010
07/04/2012 <----> the date it return in the callback is 07/04/2010
I looked all threw my code to see if they're is a place where i am adding 1 year to the date.
but can't find it. i have been trying now for at least 2 days to figure this out.
Here's my code:
Ext.onReady(function(){
Ext.QuickTips.init();
// for this demo configure local and remote urls for demo purposes
var url = {
local: '', // static data file
remote: '../myurl.asp'
};
// configure whether filter query is encoded or not (initially)
var encode = true;
// configure whether filtering is performed locally or remotely (initially)
var local = false;
var PostStore = new Ext.data.JsonStore({
// store configs
autoDestroy: true,
baseParams : {filter : '[{"type":"boolean","value":false,"field":"is_sent_post"}]'},// we start only with is_sent == false
url: url.remote,
remoteSort: false,
sortInfo: {
field: 'date_creat_post',
direction: 'DESC'
},
storeId: 'Post_Store',
// reader configs
idProperty: 'id_post',
root: 'Post',
totalProperty: 'totalcount',
fields: [{
name: 'id_post',
type: 'number'
}, {
name: 'name_post',
type: 'string'
}, {
name: 'date_creat_post',
type: 'date'//,
//dateFormat: 'Y-m-d H:i:s'
}, {
name: 'from_addr_post',
type: 'string'
}, {
name: 'sender_name_post',
type: 'string'
}, {
name: 'is_sent_post',
type: 'boolean'
}, {
name: 'date_sending_post',
type: 'date'//,
//dateFormat: 'Y-m-d H:i:s'
}, {
name: 'html_post',
type: 'string'
}, {
name: 'list_send_post',
type: 'number'
}],
writer: new Ext.data.JsonWriter({
writeAllFields: true
}),
autoSave: false,
batch: true
});
var filters = new Ext.ux.grid.GridFilters({
// encode and local configuration options defined previously for easier reuse
encode: encode, // json encode the filter query
local: local, // defaults to false (remote filtering)
filters: [{
type: 'numeric',
dataIndex: 'id_post'
}, {
type: 'string',
dataIndex: 'name_post'
}, {
type: 'date',
dataIndex: 'date_creat_post'
}, {
type: 'string',
dataIndex: 'from_addr_post'
}, {
type: 'string',
dataIndex: 'sender_name_post'
}, {
type: 'boolean',
dataIndex: 'is_sent_post'
}, {
type: 'date',
dataIndex: 'date_sending_post'
}, {
type: 'string',
dataIndex: 'html_post'
}, {
type: 'numeric',
dataIndex: 'list_send_post'
}]
});
// use a factory method to reduce code while demonstrating
// that the GridFilter plugin may be configured with or without
// the filter types (the filters may be specified on the column model
var createColModel = function (finish, start) {
var columns = [{
dataIndex: 'id_post',
hidden:true,
header: 'Id',
// instead of specifying filter config just specify filterable=true
// to use store's field's type property (if type property not
// explicitly specified in store config it will be 'auto' which
// GridFilters will assume to be 'StringFilter'
filterable: true
//,filter: {type: 'numeric'}
}, {
dataIndex: 'name_post',
header: 'Subject',
width: 150,
id: 'postname',
filter: {
type: 'string'
// specify disabled to disable the filter menu
//, disabled: true
}
}, {
dataIndex: 'date_creat_post',
header: 'Date Created',
renderer: Ext.util.Format.dateRenderer('d/m/Y'),
filter: {
type: 'date' // specify type here or in store fields config
}
}, {
dataIndex: 'from_addr_post',
header: 'From Address',
hidden:true,
id: 'fromaddress',
filter: {
type: 'string'
// specify disabled to disable the filter menu
//, disabled: true
}
}, {
dataIndex: 'sender_name_post',
header: 'Sender Name',
id: 'sendername',
filter: {
type: 'string'
// specify disabled to disable the filter menu
//, disabled: true
}
}, {
dataIndex: 'is_sent_post',
header: 'Status',
filter: {
type: 'boolean' // specify type here or in store fields config
},
renderer: function(value) {
var rtn = (value == 1) ? 'sent' : 'stand-by';
return rtn
}
}, {
dataIndex: 'date_sending_post',
header: 'Sending Date',
hidden:true,
//renderer: Ext.util.Format.dateRenderer('d/m/Y'),
filter: {
type: 'date' // specify type here or in store fields config
}
}, {
dataIndex: 'list_send_post',
header: 'Opticians list',
hidden:true,
id: 'optlist',
filter: {
type: 'number'
// specify disabled to disable the filter menu
//, disabled: true
}
}];
return new Ext.grid.ColumnModel({
columns: columns.slice(start || 0, finish),
defaults: {
sortable: true
}
});
};
/*
//======================contextMenu triggered by right click========================================
*/
var doRowCtxMenu = function ( thisGrid, rowIndex,cellIndex, evtObj )
{
//Ext.popup.msg('Done !', 'Right clicked !');
evtObj.stopEvent();
var sm = thisGrid.getSelectionModel();
var records = sm.getSelections(); // returns an array of Ext.data.Records
try
{
//var r = records[0]; // get the 1st Ext.data.Record of the list
thisGrid.rowCtxMenu = new Ext.menu.Menu({
items: [{
text : '<span style="color:red;">Delete Selected Email ?</span>',
handler : function () {
deletePost(records,thisGrid);
}
}]
});
thisGrid.rowCtxMenu.showAt(evtObj.getXY());
}
catch(err)
{
Ext.popup.msg('Warning !', 'You need to select a row first !');
}
};
/*
//======================END contextMenu triggered by right click========================================
//======================Delete Post Fonction =================================================
*/
function deletePost(records,thisGrid)
{
Ext.Msg.show({
title :'Warning !',
msg : 'You are about to delete 1 email !',
buttons : Ext.Msg.YESNOCANCEL,
fn : function(btn){
if (btn=='yes')
{
var store = thisGrid.getStore();
var s = thisGrid.getSelectionModel().getSelections();
for(var i = 0, r; r = s[i]; i++){
store.remove(r);
}
store.proxy.conn.url = '../myurl.asp';
store.save();
lastOptions = store.lastOptions;
/*Ext.apply(lastOptions.params, {
//myNewParam: true
});*/
store.load(lastOptions);
}
},
animEl : 'elId'
});
}
/*
//======================End delete Function========================================
*/
var Postgrid = new Ext.grid.GridPanel({
id:'post_grid',
border: false,
width: 462,
height:250,
store: PostStore,
colModel: createColModel(8),
loadMask: true,
viewConfig:{
emptyText:'No Post to display, change/clear your filters, refresh the grid or add a new Email!'
},
plugins: [filters],
sm: new Ext.grid.RowSelectionModel({
singleSelect: true,
listeners: {
rowselect: function(sm, row, rec) {
Ext.getCmp("post_form").getForm().loadRecord(rec);
//Ext.getCmp("htmlEdit").setValue("sdcdsdcdscsdc");
}
}
}),
//autoExpandColumn: 'company',
listeners: {
cellcontextmenu : doRowCtxMenu,
render: {
fn: function(){
PostStore.load({
params: {
start: 0,
limit: 50
}
});
}
}
},
bbar: new Ext.PagingToolbar({
store: PostStore,
pageSize: 50,
plugins: [filters]
})
});
// add some buttons to bottom toolbar just for demonstration purposes
Postgrid.getBottomToolbar().add([
'->',
{
text: 'Clear Filter Data',
handler: function () {
Postgrid.filters.clearFilters();
}
}
]);
var panelGrid = new Ext.Panel({
width : 462,
height : 250,
layout : 'fit',
renderTo: 'post-grid',
items: Postgrid
});
});
i will give my callback in firebug json:
{"totalcount":3, "Post": [{"id_post": 83,"name_post": "ghfgh","date_creat_post": "29\u002F04\u002F2011","from_addr_post": "fgh#sdf.com","sender_name_post": "gfh","is_sent_post": false,"date_sending_post": "29\u002F04\u002F2011","html_post": "<p>dfgdgdgd<\u002Fp>","list_send_post": null},{"id_post": 61,"name_post": "thomas test","date_creat_post": "28\u002F07\u002F2010","from_addr_post": "","sender_name_post": "","is_sent_post": false,"date_sending_post": "28\u002F07\u002F2010","html_post": "<p>test test test ets<\u002Fp>","list_send_post": null},{"id_post": 59,"name_post": "kevin test","date_creat_post": "29\u002F06\u002F2010","from_addr_post": "kevin#art-systems.net","sender_name_post": "kevin#art-systems.net","is_sent_post": false,"date_sending_post": "29\u002F06\u002F2010","html_post": "<p>jkljljoi ioijiio ijiojio oijio joijoi<\u002Fp>\u000A<p> <\u002Fp>\u000A<p><span style=\u0022background-color: #ffffff;\u0022>igiuihhuhi<\u002Fspan><\u002Fp>","list_send_post": null}]}
Thanks in advance i hope some on on the wicked web can help me....
cheers.
so after trying many solution giving to be i came to this has problem
finally the the date example after many attemps to format and inserting in my msSQL database
this problem is the problem : 13\09\2011 (d/m/Y) becomes this 09/01/2012 (d/m/Y) so for some reason the month 13 is being added to the month so say the 13 month doesn't exist so the date will go to 09/01/2012....
after looking again it's the format that doesn't seem ok so i changed it de (m/d/Y) and now im getting a sql error when i hit 13 day on my datefield in (extjs).
"The conversion of a varchar data type to a datetime data type resulted in an out-of-range value."
and on and on does anyone have any ideas now ????

Answer 1

Instead of using the built in Ext.util.Format.dateRenderer, you could try creating one of your own that parses the Date as desired.
ataIndex: 'date_creat_post',
header: 'Date Created',
renderer: daterenderer
And then a function for your daterenderer:
function dateRenderer(value, id, r) {
var myDate = r.data['date_creat_post'];
// do some things here to strip out the date and make it into a happy format
var d = new Date(myDate);
return d.format('d/m/Y');
}