PDA

View Full Version : Assign The value returned from ajax to a textfield in extjs



evs.saad
28 Jan 2013, 6:54 AM
Hi,
I have a drop down and when the option is selected from that drop down ajax call is requested and that ajax file returns a date. Now I want to assign that date textfield the date returned from ajax file. Is there any way we can assign the values returned from the ajax to the textfield. Here is my code

//the variable is the ajax call that is made when the dropdown value is selected or changed
var loadDate = new Ext.data.JsonStore({
url: 'load_date.php?task=LOAD_DATE',
method: 'POST',
id: 'load_date',
root: 'results',
fields: [{name:'loaded_date',type:'string'}]
});
// this is the code for text field
{
fieldLabel: ' Date',
xtype: 'datefield',
id: 'date',
displayField: 'loaded_date',
valueField: 'loaded_date',
style: "float: left; margin-left:3px;",
value:loadDate,
width:100
},

{
xtype:'combo',
fieldLabel: 'Display',
id:'future_date',
name:'future_date',
hiddenName:'future_date',
store:data.DateOptions,
typeAhead: true,
mode: 'local',
triggerAction: 'all',
selectOnFocus: true,
lastQuery: '',
emptyText:'Select an option...',
width : 120,
listeners : {
select : function (f, e){
var future_date_value = Ext.getCmp('future_date').getValue();
loadDate.reload({
params: { date: future_date_value}
});
// after this value is reloaded I want to assign the value returned to above mentioned textfield.
}
}
}
Can anyone help. Thanks in advance

sword-it
29 Jan 2013, 5:41 AM
Hi Eva.saad,

You can use setValue(newDate) of the field , newDate is a variable (date) which is return from ajax call.like-



getDateFieldReference.setValue(newDate);


http://docs.sencha.com/ext-js/3-4/#!/api/Ext.form.DateField-method-setValue

evs.saad
29 Jan 2013, 6:35 AM
Thanks for replying. My question is that how can I get the returned value when the ajax is triggered


//say I kept this reload in a variable

var date_returned = loadDate.reload({ params: { date: future_date_value} });
// now here if I alert the date returned it returns undefined. The ajax file is
// is returning the date like this echo $date;

Can you please guide me that how can I get the value from the ajax file returned and
then assign it to the field.Thanks

willigogs
29 Jan 2013, 8:07 AM
One possibility:


var loadDate = new Ext.data.JsonStore({
url: 'load_date.php?task=LOAD_DATE',
method: 'POST',
id: 'load_date',
root: 'results',
fields: [{name:'loaded_date',type:'string'}],
listeners: {
load: function(thisStore, records, options) {
var loaded_date = records[0].get('loaded_date');
Ext.getCmp('date').setValue(loaded_date);
}
}
});

Depending on the value being received in the store, you may have to reformat it in order for the dateField to accept it. See Sword-it's link in his previous comment if this is required.

evs.saad
29 Jan 2013, 8:36 AM
Thanks a lot willigogs. My problem is solved.