PDA

View Full Version : Strange datefield behaviour.



stedav
16 Nov 2009, 6:16 AM
Hi,

Its my first time posting, so be gentle! I am working on an java based application with an ExtJS web client front-end. One of the services offered is to search certain data in a database based on a set of parameters centered around a date. All functionality is 100% the searches work, the JSON returns, and the grid is populated nicely. Recently there was a requirement to update the search, with the addition of some shortcut buttons, who's simple task is to add a date to the datefied included in the search form. The three buttons are 'Yesterday' , 3 days Ago' and 'Last Week'. The methods called (in java) return a correclty formatted date which is then set to the datepicker (xtype declaration). Debug information from my IDE and Firebug (god bless its cotton socks), with a console.log() command, show that, indeed the dates returned are all present and correct, and from there there should be no problems. However, upon completing the '.setValue()' for the datefield, for the yesterday and the 3 days ago functions, the date that appears in the field is a year and a few days ahead of the date actually returned by the method (and displayed in firefox), whilst the last week date is all fine, and appears correclty. To prevent more blarb, here is the guilty code.(abbreviated to the relevant parts)

Ext.



...
items : [{

id : 'historyStartDate',
name : 'historyStartDate',
fieldLabel : 'Start date',
xtype : 'datefield',
width : 100,
format : 'Y/m/d'


},{ ...

...
iitems : [{

xtype : 'button',
id : 'HyesterdayButton',
name : 'yesterdayButton',
text : "Yesterday",
width : 100,
handler : History_Yesterday

},{

xtype : 'button',
id : 'H3DaysAgoButton',
name : 'h3DaysAgoButton',
text : "3 days ago ",
width : 100,
handler : History_3DaysAgo

},{

xtype : 'button',
id : 'HlastWeekButton',
name : 'lastMonthButton',
text : "Last Week",
width : 100,
handler : History__LastWeek

}]
..and now the Java / JSP / JavaScript functions:



Format dateFormatter = new SimpleDateFormat("dd/MM/yyyy");

%>



/**********************************************************************************************/

History_Yesterday = function()
{

<%
Calendar cal = Calendar.getInstance();
cal.add(Calendar.DATE,-1);
String yesterday = dateFormatter.format(cal.getTime()).trim();

%>



Ext.getCmp('historyStartDate').setValue('<%=yesterday%>');
}



History_3DaysAgo = function()
{
<%
Calendar cal3 = Calendar.getInstance();
cal3.add(Calendar.DATE,-3);
String three= dateFormatter.format(cal3.getTime()).trim();

%>



Ext.getCmp('historyStartDate').setValue('<%=three%>');
}



History__LastWeek = function()
{
<%
Calendar cal7 = Calendar.getInstance();
cal7.add(Calendar.DATE,-7);
String week = dateFormatter.format(cal7.getTime()).trim();
%>



Ext.getCmp('historyStartDate').setValue('<%=week%>');
}

/ with a call to console.log() to the three strings 'yesterday','three' and 'week' just before the Ext call in each method, the values are formatted and correct to the day.

and now the issue:

See attachment, and:

Firebug output with console.log()

15/11/2009 // This is the yesterday function result

13/11/2009 // This is the 3 days ago function result
09/11/2009 // This is the week ago function result

However, as shown in the attachment, the values after setValue() in the datefield are:

(based on todays date (Calendar.getTime();) 16/11/2009)

2010/03/11 // for Yesterday
2010/01/11 // for 3 days ago
2009/09/11 // for a week ago (correct)



Its probably something ridiculously obvious, but a little additional cranium juice wouldn't go amiss!

Thanks

Stedav

:-/