Opened 9 years ago

Closed 9 years ago

Last modified 7 years ago

#6229 closed bug (notabug)

jQuery 1.4.2-1.4.3, UI 1.8.5, ajax tabs selector and selected option broke

Reported by: zerointeger Owned by:
Priority: minor Milestone:
Component: ui.tabs Version: 1.8.5
Keywords: tabs, ajax, selected element Cc:
Blocked by: Blocking:

Description

I have been scouring around looking for more information, as well as attempting to debug some of the methods and objects internal to both libraries but am not having any luck.

Here is a description of the problem I am experiencing since upgrading.

Output from the firebug plugin shows GET requests take place but the content is always referring to the last tab element in the UL list and does not load into the ui.panel or ui.tab page element(s).

Here is an example: <script src="libs/js/jquery-1.4.3.min.js"></script>

<script src="libs/js/jquery-ui-1.8.5.custom.min.js"></script>

<script src="libs/js/jquery.cookie.js"></script>

<script type="text/javascript">

var $j = jQuery.noConflict();

$j(document).ready(function() {

var tabID = $j.cookie('tabID')
0;

$j('#tabs').tabs({

ajaxOptions: {

async: true,

cache: true,

},

selected: tabID,

show: function(junk, ui) {

$j.cookie('tabID', ui.index, {expires:3600});

},

});

});

</script>

<div id="tabs" class="tabs">

<ul id="tabID">

<li><a href="content.php?do=0x00a0" />One</a></li> <li><a href="content.php?do=0x00b0" />Two</a></li> <li><a href="content.php?do=0x00c0" />Three</a></li>

</ul>

</div>

Output from firebug shows that upon initial page load the 'selected' option (which should load the last tab element integer stored in the cookie), is sending a GET request for the last element in the UL list. In this case do=0x00c0. On top of that the response from the ajax GET request does not load in the ui.panel or ui.tab element(s).

I am using Linux (Kubuntu), Firefox 3.6.10 canonical - 1.0 if that makes a difference.

Attachments (1)

test.php (1.9 KB) - added by zerointeger 9 years ago.
Test case demonstrating broken cookie, ajax initial page load

Download all attachments as: .zip

Change History (9)

comment:1 Changed 9 years ago by Scott González

Resolution: worksforme
Status: newclosed

This works fine for me (didn't use the cookie plugin). Please use the forums for help.

comment:2 Changed 9 years ago by zerointeger

Resolution: worksforme
Status: closedreopened

Then why would the contents of:

load:function(a){a=this._getIndex(a);

Result in a -1?

I am assuming this value should be the value of the cookie or the first tab element within the element being used?

And why would the contents of:

h=d.data(c,"load.tabs");

Always result in the last tab's href value?

Shouldn't that be the href value of currently loaded tab?

comment:3 Changed 9 years ago by Scott González

Resolution: worksforme
Status: reopenedclosed

As far as I can tell, the problem is in your code, not the plugin. As previously stated, please use the forums, or provide a full test page that shows the problem using just the tabs plugin.

comment:4 Changed 9 years ago by zerointeger

Resolution: worksforme
Status: closedreopened

Here is a very simple test case to illustrate the problem.

Upon first page load the page request is defaulting to the last list element href value (?do=0x00f0) when it should be loading the last tab id href value.

Once the page loads for the first time you can load the content for each tab normally but it is the initial loading that causes problems.

<?php switch($_GETdo?) {

case '0x00a0':

echo 'test-a.html';

case '0x00b0':

echo 'test-b.html';

case '0x00c0':

echo 'test-c.html';

case '0x00d0':

echo 'test-d.html';

case '0x00e0':

echo 'test-e.html';

case '0x00f0':

echo 'test-f.html';

default:

echo 'test-a.html';

} ?> <!DOCTYPE html PUBLIC "-W3CDTD XHTML 1.0 TransitionalEN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<link rel="stylesheet" type="text/css" href="templates/default/css/overcast/jquery-ui-1.8.5.custom.css" /> <link rel="stylesheet" type="text/css" href="templates/default/css/default.css" /> <script type="text/javascript" src="libs/js/jquery-1.4.3.min.js"></script> <script type="text/javascript" src="libs/js/jquery-ui-1.8.5.custom.min.js"></script> <script type="text/javascript" src="libs/js/jquery.cookie.js"></script> <script type="text/javascript">

var $j = jQuery.noConflict(); $j(document).ready(function() {

var loading = '<img src="templates/default/images/loading.gif" width="20" height="20" alt="Loading content..." title="Loading content..." />';

var tabID = $j.cookie('tabID')
0;

$j('#tabs').tabs({

rotate: 0, ajaxOptions: [{async:true,cache:true}], fx: [{opacity:'toggle',height: 'toggle',duration:'normal'}], selected: tabID, show: function(junk, ui) {

$j.cookie('tabID', ui.index, {expires:3600});

}, spinner: loading

});

});

</script>

</head> <body>

<div id="tabs" class="tabs">

<ul id="tabID">

<li><a href="content.php?do=0x00a0">Main</a></li> <li><a href="content.php?do=0x00b0">Purchasing</a></li> <li><a href="content.php?do=0x00c0">Inventory</a></li> <li><a href="content.php?do=0x00d0">Reports</a></li> <li><a href="content.php?do=0x00e0">Options</a></li> <li><a href="content.php?do=0x00f0">Exit</a></li>

</ul>

</div>

</body>

</html>

Changed 9 years ago by zerointeger

Attachment: test.php added

Test case demonstrating broken cookie, ajax initial page load

comment:5 Changed 9 years ago by Scott González

Resolution: invalid
Status: reopenedclosed

You're passing a string (the result of the cookie) instead a number. If you use parseInt() on the result of $.cookie(), it will work.

comment:6 Changed 9 years ago by zerointeger

Can the documentation regarding this be updated?

comment:7 Changed 9 years ago by Scott González

The documentation said that the selected option accepts a Number. I'm not sure what else you'd want.

comment:8 Changed 7 years ago by Scott González

Milestone: TBD

Milestone TBD deleted

Note: See TracTickets for help on using tickets.