Question

I am using Extjs 3.3.1

I have a pretty complex page, and I cannot change the order of initialization of the objects.

In one of my init functions, I need a grid/store/combobox but the corresponding ComponentMgr/StoreMgr returns null for a certain ID, and I know that it will be available after all of the onReady scripts executes. So is there a way of postponing the execution of the functions, until those components are ready, or adding it as an event and getting it triggered when those components are ready. I tried adding that function to the onReady event, but I guess it executes itself right-away, because it is already in ready-state.

Answer 1

I see two options out of the box:

• put a function that will call the init function in the last ready callback
• you can create a timer to check when the objects are ready.

Example code for the second option:

function myInitFunction() {
    // some code that doesn't need the component... if any

    executeWhenReady('componentId', executeCodeWhichNeedsComponent);

    function executeCodeWhichNeedsComponent(component) {
        // this is just the code where you actually need the component
        // an example:
        component.addChild(new ChildComponent);
        component.show();
        // etc...
    }
}

function executeWhenReady(cmp, fn) {
    if (! Ext.get(cmp)) {
        setTimeout(function() { executeWhenReady(cmp, fn); }, 20);
    } else {
        fn(Ext.get(cmp));
    }
}

I’d just like to add that inside executeCodeWithComponent you won’t have the same this. If you want to preserve it let me know and I’ll update the code.

I know both solutions are not that clean, but the best option would be to refactor your code and you said you can’t do that.