PDA

View Full Version : datefield question



reminder
23 Apr 2008, 9:52 PM
hello ext users.
It seems that i cannot set the initial value for a datefield!?


xtype: 'datefield',
fieldLabel: '{$lng["date_from"][$ln]}',
name: 'date_from',
allowBlank: false,
id: 'date_from',
format: 'd/m/Y',
value: new Date().format("d/m/Y")

when i open the page the datefield is empty?
any suggestion appreciated.
thanx in advance!

catacaustic
23 Apr 2008, 10:32 PM
You're almost right. To set the date, you need to use a date object, not a date string. What you need to do is:
value: new Date()

reminder
23 Apr 2008, 10:43 PM
still nothing...


xtype: 'datefield',
fieldLabel: '{$lng["date_from"][$ln]}',
name: 'date_from',
allowBlank: false,
id: 'date_from',
format: 'd/m/Y',
value: new Date()

i see the value into the field before the component renders the datefield and then the value disapears?
the form is into an accordion layout with animate set to false!
suggestions?

reminder
24 Apr 2008, 12:26 AM
any help on this problem?

reminder
24 Apr 2008, 1:14 AM
ill explain more accurately.
i have an accordion layout with 3 panels.
now when i expand the second panel i add the form panel into with dolayout().
this all works fine...
but when the form renders into the value of the datefield disapear?!
i can see in the middle sequence when the form renders into the panel that the value fo rthe datefield is set and when the UI component is rendered till end the value disapear.


// just a piece of code
{
region:'west',
split:true,
width: 280,
minSize: 200,
maxSize: 400,
margins:'0 0 0 0',
layout:'accordion',
layoutConfig:
animate: false,
activeOnTop: false
},
items: [
{title:'{$lng["menu"][$ln]}', id:'trees', border:false, layout:'fit'},
{title:'{$lng["timeline"][$ln]}', id:'vehicle_tree_foot', layout:'fit', border:false, listeners:{'expand':function() { if(timelineactive == false) { var obj = Ext.getCmp('vehicle_tree_foot'); obj.add(timelineform()); obj.doLayout(); }}}},
{title:'{$lng["settings"][$ln]}', id:'global_settings', layout:'fit', border:false, listeners:{'expand':function() { if(timelineactive == false) { var obj = Ext.getCmp('global_settings'); obj.add(settingsform()); obj.doLayout(); }}}}
]
}

// the form function
var timelineactive = false;
function timelineform() {
if(timelineactive == true) return;
timelineactive = true;
Ext.form.Field.prototype.msgTarget = 'side';
var timeline = new Ext.FormPanel({
labelWidth: 120, // label settings here cascade unless overridden
frame:false,
border:false,
bodyStyle:'padding:10px;background-color:#dfe8f6;text-align:left',
defaults: {width: 100, bodyStyle: 'text-align: left'},
items: [{

///////////////////// this datefield wont show the value??????????
xtype:'datefield',
fieldLabel: '{$lng["date_from"][$ln]}',
value: new Date(),
name: 'date_from',
id:'date_from',
format:'d/m/Y',
allowBlank: false,
vtype: 'daterange', //daterange with the advanced vtypes is ok! no errors
endDateField: 'date_to',
listeners: {
focus: function() { if(Ext.getCmp('show_real_time').getValue() == true) Ext.getCmp('show_real_time').setValue(false); }
}
///////////////////////////////////////////////////////////7
}, new Ext.form.TimeField({
fieldLabel: '{$lng["time_from"][$ln]}',
name: 'time_from',
minValue: '0:00am',
maxValue: '11:00pm',
id:'time_from',
listeners: {
focus: function() { if(Ext.getCmp('show_real_time').getValue() == true) Ext.getCmp('show_real_time').setValue(false); }
}
}),{
xtype:'checkbox',
fieldLabel: '{$lng["activate_to"][$ln]}',
name: 'activate_to',
id:'activate_to',
listeners:{check:function() { if(this.getValue() == true) { Ext.getCmp('cmd_anim').setDisabled(false); Ext.getCmp('date_to').setDisabled(false); Ext.getCmp('time_to').setDisabled(false); } else { Ext.getCmp('cmd_anim').setDisabled(true); Ext.getCmp('date_to').setDisabled(true); Ext.getCmp('time_to').setDisabled(true); } } }
},{
xtype:'datefield',
fieldLabel: '{$lng["date_to"][$ln]}',
name: 'date_to',
allowBlank:false,
vtype: 'daterange',
startDateField: 'date_from',
disabled:true,
id:'date_to',
listeners: {
focus: function() { if(Ext.getCmp('show_real_time').getValue() == true) Ext.getCmp('show_real_time').setValue(false); }
}
}, new Ext.form.TimeField({
fieldLabel: '{$lng["time_to"][$ln]}',
name: 'time_to',
minValue: '0:00am',
maxValue: '11:00pm',
disabled:true,
id:'time_to',
listeners: {
focus: function() { if(Ext.getCmp('show_real_time').getValue() == true) Ext.getCmp('show_real_time').setValue(false); }
}
}),{
xtype:'checkbox',
fieldLabel: '{$lng["show_real_time"][$ln]}',
name: 'show_real_time',
checked:true,
id:'show_real_time',
listeners: {
check: function() {
if(this.getValue() == true) {
Ext.getCmp('date_from').setValue('');
Ext.getCmp('time_from').setValue('');
Ext.getCmp('activate_to').setValue(false);
Ext.getCmp('date_to').setValue('');
Ext.getCmp('date_to').setDisabled(true);
Ext.getCmp('time_to').setValue('');
Ext.getCmp('time_to').setDisabled(true);
}
}
}
}
],
buttons: [{
text: '{$lng["show_route"][$ln]}',
listeners: {
click: function() {
if(selectedCarId == 0) {
alert("{$lng["choose_car"][$ln]}");
return;
}
var dt_from = new Date(Ext.getCmp('date_from').getValue()+Ext.getCmp('time_from').getValue());
if(Ext.getCmp('activate_to').getValue() == true) {
var dt_to = new Date(Ext.getCmp('date_to').getValue()+Ext.getCmp('time_to').getValue());
showRoute(dt_from.format('Y-m-d H:i:s'), dt_to.format('Y-m-d H:i:s'));
} else {
showRoute(dt_from.format('Y-m-d H:i:s'));
}
}
}
}]
});
return timeline;
}

reminder
24 Apr 2008, 2:03 AM
solevd with giving value dinamicly after adding the form to the accordion panel.
thanx anyway!