Results 1 to 4 of 4

Thread: Initialize component after AJAX call

  1. #1
    Touch Premium Member
    Join Date
    Mar 2010
    Posts
    21

    Question Initialize component after AJAX call

    Hi,
    I have a situation where I need to apply and initialize my superClass after completion of AJAX request. However if I move the Ext.apply and initComponent.apply inside "success" it is not working. If I place it outside it is not waiting for the AJAX request to complete, which is expected behavior.

    Please advise me on how to handle this situation.

    PHP Code:
                ...        
                ...
                
    initComponent : function() {
                
    Ext.Ajax.request({
                        
    url this.utpUrl,
                        
    success : function(response) {                        
                            
    this.sapData = new Ext.Template(response.responseText);
                            
    this.sapData.compile();
                        }
                });
                
                
    Ext.apply(this, {
                    
    itemsthis.utpItems,
                    
    sapData:this.sapData                    
                
    });
                
    UTP.sap.SapPage.superclass.initComponent.apply(thisarguments);
            } 
    Thanks in advance.

    Regards,
    Nagaraj

  2. #2
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    You obviously can't do that due to the ansynchronous behaviour of requests.

    You will have to move the Ext.Ajax.request outside of the component and only create the component when the response is received.

    Another method would be rewriting your component so the response data won't be needed in initComponent and the component can function without it until the response is received.

  3. #3
    Touch Premium Member
    Join Date
    Mar 2010
    Posts
    21

    Default

    Thanks Condor. If you can refer to any relevant post or a small example it will be helpful or even a small skeleton structure will do.

  4. #4

    Default

    Sure.

    Code:
    Ext.onReady(function() {
      Ext.Ajax.request({
        ...
        success: function(resp) {
          var cfg = {...};
          var mySpecialCmp = new CustomSpecialCmp(cfg);
        }
    });
    or

    Code:
    ...
    initComponent: function () {
        Ext.Ajax.request({
            url: this.utpUrl,
            success: this.handleResponse,
            scope: this
        });
        UTP.sap.SapPage.superclass.initComponent.apply(this, arguments);
    },
    handleResponse: function(response) {
        //build tCfg from response
        var tCfg = {
          sapData: new Ext.Template(response.responseText)
        };
        tCfg.sapData.compile();
    	this.add(new CustomObj(tCfg));
    }
    Wes

Similar Threads

  1. initialize component with configs
    By wiulma in forum Ext GWT: Discussion
    Replies: 1
    Last Post: 14 May 2010, 1:19 AM
  2. [SOLVED] Unable to add component to GroupTabPanel after AJAX call
    By PV-Patrick in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 4 May 2010, 12:39 PM
  3. how to call register component to handler
    By lalit_ce in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 15 Oct 2008, 5:27 AM
  4. Ajax callback is executed before Ajax call returned
    By mxu in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 31 Dec 2007, 12:42 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •