Reputation: 6907
Im trying to mask a tree panel without the toolbar so that the user can keep typing as the panel is masked. This seems to be harder than I thought so some suggestions would be great!
Although its prob not necessary, Here is my (stripped down) base tree panel:
Ext.tree.TreePanel({
id:'quicksearch_panel',
root:{
nodeType:'async',
preloadChildren:false
},
loader: new Ext.tree.TreeLoader({
dataUrl:'...',
baseParams:{}
}),
tbar:['Quicksearch:', {
xtype:'textfield',
id:'quicksearch_combo',
emptyText: 'search...',
listeners:{
keyup:{buffer:400, fn:function(field, e) {
// Mask Panel and not Combo HERE
}}
}
}]
});
Upvotes: 0
Views: 1973
Reputation: 8079
I think you can try to mask the body
of the TreePanel? The Element body
is an element in all components that inherits Panel
, and the Toolbar is in fact out of this body
element so you probably could just mask the body
, your toolbar will be out of the masking overlay.
Try this:
var tree = Ext.tree.TreePanel({
//......
tbar: ['Quicksearch:', {
xtype:'textfield',
emptyText: 'search...',
enableKeyEvents: true, //you need this for key events
listeners:{
keyup:{
buffer:400,
fn:function(field, e) {
tree.body.mask();
//When the searching done, unmask it
//tree.body.unmask();
}
}
}
}]
});
Do update us if it works :)
Upvotes: 1