ExtJS: ajax call on keystroke not working while another call is existant

Question

So I have a situation where there is an ajax call made after a keystroke (with buffer:150). If (for whatever reason) the ajax call is slightly laggy to return, keypress during that load process fail to make another call.

The component is a tree using a loader for the data. And is setup as follows:

tree config

....
root:{
    nodeType:'async',
    text:'Accounts',
    expanded:false,
    uiProvider:false
},
loader: {
    dataUrl:'dataurl',
    baseParams:{},
    loadexception:function(){
        console.log('Failed to load QUICKSEARCH');
    }
}
....

with the following on a text field

textfield listener

....
listeners:{
keyup:{buffer:150, fn:function(f, e) {
    if(Ext.EventObject.ESC == e.getKey()) {
        field.onTriggerClick();
    }else{
    var val = this.getRawValue();
            thisTree = this.ownerCt.ownerCt;
            thisTree.loader.baseParams.quicksearch_string = val;
            thisTree.root.reload();
    }
}}
}
....

Ideally, I want to be able to cancel (either completely cancel, or cancel listening for the response) the call and start the new one.

So I guess there should actually be a question in here somewhere...So is there a way to cancel listening for a previously made ajax call or a setting to force a newer call

Answer 1

Try an alternative way of reloading the tree. Here is another syntax I have seen.

thisTree.getLoader().load(thisTree.root);