JQuery tabs: cookie and "selected" wont work together

Question

I am using jQuery tabs with six tabs to show a bunch of reports, with a few reports on each tab. I am using the jQuery cookie plugin to remember the tab - this works ok. Page submit is slow because all reports are refreshed unconditionally each time a submit is called. I want to add a condition so that only the report on the currently selected tab is refreshed. Ideally, I want to maintain the tab# in a hidden item and create a condition for each report (or region) to only display when it's tab is selected.
Jari's blog article shows how to assign the tab number to a page item
http://dbswh.webhop.net/dbswh/f?p=BLOG:READ:0::::ARTICLE:195800346705831
But using "selected" seems to break the cookie: after changing the tab (and correctly updating the page item), the next submit changes the tab to the prior one selected. I cannot get both to work at once. I never want to reset the selected tab from the one in the cookie ; I only want to save the selected tab#. Users can only change tabs by clicking on a tab. I am not much of a javascript developer so it is likely to be something trivial.
This is my page header javascript - you can see where I've added a chunk of Jari's code.
<script type="text/javascript">
//<![CDATA[  
   $(function(){ 
   $tabs = $("#PANE_1_T");
   $tabs.tabs({
       selected:'&P17000_SELECTED_TAB.',
       select:function(e,u){
        var a=new htmldb_Get(null,&APP_ID.,"APPLICATION_PROCESS=DUMMY",&APP_PAGE_ID.)
        a.add("P17000_SELECTED_TAB",u.index);
        var r=a.get();
    $tabs.tabs({ cookie: { expires: 1}});     
    $tabs.parents('td').eq(0).removeAttr('width');
    $tabs.show();
//]]>
</script>(Apex 3.2.1)
What am I doing wrong?
Any help appreciated!
Mark Teehan, Singapore

Answer 1

Hi,
If you submit/reload page you can not set condition that only one report is "refreshed".
When you submit and page reloads again all regions are loaded what you have on page.
Of course you can set condition that all regions are not shown, but as I understand you are not looking for that.
In Apex 3.2, you could call $a_report function to partial page refresh only one report.
Or use various other JavaScript and Ajax method to refresh only one report.
And as I understand, you have same info in cookie and item if you could use those in same time. Why not just use that item? Then you do not need load cookie plugin.
You could change code
   $tabs.tabs({
       selected:"&P17000_SELECTED_TAB.",
       select:function(e,u){
        var a=new htmldb_Get(null, &APP_ID., "APPLICATION_PROCESS=DUMMY", &APP_PAGE_ID.)
        a.add("P17000_SELECTED_TAB", u.index);
        var r=a.get();
       $s("P17000_SELECTED_TAB", u.index);
     });To set item value also in HTML document so you can access it easily using JavaScript.
Below part is change and set item value in HTML document
$s("P17000_SELECTED_TAB", u.index);Regards,
Jari