1. #1
    Sencha User
    Join Date
    Jul 2012
    Posts
    53
    Vote Rating
    0
    evs.saad is on a distinguished road

      0  

    Default Assign The value returned from ajax to a textfield in extjs

    Assign The value returned from ajax to a textfield in extjs


    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
    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

  2. #2
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,333
    Vote Rating
    85
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default use setValue() method of the date field.

    use setValue() method of the date field.


    Hi Eva.saad,

    You can use setValue(newDate) of the field , newDate is a variable (date) which is return from ajax call.like-
    Code:
      getDateFieldReference.setValue(newDate);
    http://docs.sencha.com/ext-js/3-4/#!...ethod-setValue
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

  3. #3
    Sencha User
    Join Date
    Jul 2012
    Posts
    53
    Vote Rating
    0
    evs.saad is on a distinguished road

      0  

    Default


    Thanks for replying. My question is that how can I get the returned value when the ajax is triggered
    Code:
    //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

  4. #4
    Sencha User
    Join Date
    Jan 2011
    Posts
    544
    Vote Rating
    52
    willigogs is a jewel in the rough willigogs is a jewel in the rough willigogs is a jewel in the rough

      0  

    Default


    One possibility:
    Code:
    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.

  5. #5
    Sencha User
    Join Date
    Jul 2012
    Posts
    53
    Vote Rating
    0
    evs.saad is on a distinguished road

      0  

    Default


    Thanks a lot willigogs. My problem is solved.

Thread Participants: 2