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…</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
}]
}]
});
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…</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
}]
}]
});