PDA

View Full Version : Scrolling content tab keys



renton
11 May 2011, 5:44 AM
Hi!

I've faced the problem, that using this code:


Ext.onReady (function() {

var viewport = new Ext.Viewport ({
layout: 'border',
items: [
new Ext.BoxComponent({
region: 'north',
id: 'north',
height: 75,
}),
new Ext.TabPanel({
region: 'center',
id: 'main-body',
resizeTabs: true,
margins: '0 5 5 5',
tabWidth: 100,
activeTab: 0,
items: [{
title: 'tab 1',
id: 'my-tab',
autoScroll: true,
autoLoad: {
url: 'long-text.html',
nocache: true,
forceSelection: true,
selectOnFocus:true,
}
}]
})
]
});
});

doesn't work the scrolling by arrow keys (and page up/down) on tab's content. Actually it works, but you should click on the content otherwise nothing happens. Does anyone know how to fix it? Thanks in advance!

live demo: http://js.1gb.ru/focus.html

fay
11 May 2011, 6:37 AM
If I understand you properly, you want my-tab's body to have the focus when the autoLoad is completed so that you can immediately use the arrow keys without having to click on the content? If so, change your autoLoad to:



// ...
autoLoad: {
url: 'long-text.html',
nocache: true,
callback: function(el, success, response, options)
{
el.focus(true);
}
}
// ...

renton
11 May 2011, 6:49 AM
Thank you!