PDA

View Full Version : How to make a datefield with validation inside a table cell



Gunjan
14 Jun 2010, 6:45 AM
Hello,

I am making datefield inside a table cell and validation for date is required.
My code for making a table is below:-

xtype:'panel',
layout:'table',
layoutConfig: {
columns: 2
},
items: [{
bodyStyle: 'background-color:#DDF1FB',
html: '<p style = "font-size:12;margin-left:5px">Title</p>',
width:100,
height:25
},{
bodyStyle: 'background-color:rgb(241,241,241)',
width:400,
height:25,
xtype:'textfield',
id:'title2',
value:curr_record.title,
style:'background-color:rgb(241,241,241)'
//height:17

},{
bodyStyle: 'background-color:rgb(241,241,241)',
width:400,
layout:'hbox',
items: [{
xtype : 'datefield',
vtype:'daterange',
endDateField: 'end_date',
name : 'startdate',
id:'strt_date',
value : new Date(Date.parse(curr_record.start_date))

},{
xtype:'tbspacer',
width:60
},{
xtype : 'datefield',
vtype:'daterange',
startDateField: 'strt_date',
name : 'endDate',
id:'end_date2',
value : new Date(Date.parse(curr_record.end_date))
}]
}


While running the code in IE , it is giving exception -> stack overflow and in Firefox(firebug) -> too much recursuion . Any help is highly appreciated. Am I doing some thing wrong.

Regards
Gunjan

Elijah
14 Jun 2010, 10:34 AM
Just cleaning it up for readability.


xtype:'panel',
layout:'table',
layoutConfig:
{
columns: 2
},
items: [{
bodyStyle: 'background-color:#DDF1FB',
html: '<p style = "font-size:12;margin-left:5px">Title</p>',
width:100,
height:25
},{
bodyStyle: 'background-color:rgb(241,241,241)',
width:400,
height:25,
xtype:'textfield',
id:'title2',
value:curr_record.title,
style:'background-color:rgb(241,241,241)'
},{
bodyStyle: 'background-color:rgb(241,241,241)',
width:400,
layout:'hbox',
items: [{
xtype : 'datefield',
vtype:'daterange',
endDateField: 'end_date',
name : 'startdate',
id:'strt_date',
value : new Date(Date.parse(curr_record.start_date))
},{
xtype:'tbspacer',
width:60
},{
xtype : 'datefield',
vtype:'daterange',
startDateField: 'strt_date',
name : 'endDate',
id:'end_date2',
value : new Date(Date.parse(curr_record.end_date))
}]
}

Gunjan
19 Jun 2010, 11:38 PM
Hi Elijah,
Thanks for cleaning my code.
Is my code too basic or lacking basic things, as you gave this comment.


Just cleaning it up for readability.


xtype:'panel',
layout:'table',
layoutConfig:
{
columns: 2
},
items: [{
bodyStyle: 'background-color:#DDF1FB',
html: '<p style = "font-size:12;margin-left:5px">Title</p>',
width:100,
height:25
},{
bodyStyle: 'background-color:rgb(241,241,241)',
width:400,
height:25,
xtype:'textfield',
id:'title2',
value:curr_record.title,
style:'background-color:rgb(241,241,241)'
},{
bodyStyle: 'background-color:rgb(241,241,241)',
width:400,
layout:'hbox',
items: [{
xtype : 'datefield',
vtype:'daterange',
endDateField: 'end_date',
name : 'startdate',
id:'strt_date',
value : new Date(Date.parse(curr_record.start_date))
},{
xtype:'tbspacer',
width:60
},{
xtype : 'datefield',
vtype:'daterange',
startDateField: 'strt_date',
name : 'endDate',
id:'end_date2',
value : new Date(Date.parse(curr_record.end_date))
}]
}

darthwes
20 Jun 2010, 12:25 AM
The 'daterange' vtype is defined as what?