PDA

View Full Version : Ajax content in sliding panel: how?



pslot
21 Jul 2010, 2:19 AM
Hi,

I'm new at the ext framework, and I try to figure out how to slide in e new panel with ajax content.
I can see the ajax request is working, but how do I replace the first pannel with the second one?

Im guessing that im not supposed to make a second panel or container ...but I cant figure out how to do it.

Thanks for reading!!!!

this is my code:


Ext.setup({
icon: 'img/icon.png',
glossOnIcon: false,
onReady: function() {


var overons = new Ext.Container({
scroll: 'vertical',
fullscreen: true,
animation: 'slide',
styleHtmlContent: true});

var makeAjaxRequest = function() {

Ext.getBody().mask(false, '<div class="demos-loading">Loading&hellip;</div>');
Ext.Ajax.request({
url: 'http://myurl.nl/content/overons.php',
success: function(response, opts) {
overons.update(response.responseText);
overons.scroller.scrollTo({x: 0, y: 0});
Ext.getBody().unmask();


}
});
};


var nestedList = new Ext.NestedList({
fullscreen: true,
items: [{

id: 'testBTN',
text: 'Test item',
customAttribute: 123,
handler: makeAjaxRequest}
,{
text: 'item 2',
items: [{
text: 'item 2a',
customAttribute: 233
},{
text: 'item 2b',
customAttribute: 2390
}]
},{
text: 'item 3',
items: [{
text: 'item 3a',
customAttribute: 903
},{
text: 'item 3b',
customAttribute: 77
}]
}]
});