Response title
This is preview!
Display accordion using ajax works fine on jq ui 1.8.23 but crashes on 1.9.1
in Using jQuery UI
•
6 months ago
I have a problem migrating some code from jquery ui 1.8.23 to 1.9.1.
The purpose of the code is to display accordions within tabs. The accordion code is present in another page called with ajax.
It works fine when set up to 1.8.23 and crashes (accordion not displayed properly) when updated to 1.9.1.
I've tried many updates ( checking out 1.9.0 and 1.9.1 changelogs) but just couldn't manage to sort this out.
Any help will be much appreciated.
Here is the code I play in my main document:
- <html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="../include/css/jquery/jquery-ui-1.9.1.custom.css" type="text/css" media="all" />
<script>
$(function () {
var $tabs = $("#tabs").tabs({
ajaxOptions: {
error: function (xhr, status, index, anchor) {
$(anchor.hash).html("<font face='arial' size='2'>Problem.</font>");
},
complete: function () {
$(".accordion").accordion({
active: 1,
autoHeight: false,
collapsible: true
});
}
}
});
});
</script>
</head>
<body>
<div id="tabs">
<ul>
<li><span class='ui-icon ui-icon-close'>Remove Tab</span><span class='ui-icon ui-icon-pencil' id='modif_categ_1' idcat='1' title='Categ1'></span><a href='accordion.php?tabs=1' name='1' title='1'>Categ 1</a></li>
<li><span class='ui-icon ui-icon-close'>Remove Tab</span><span class='ui-icon ui-icon-pencil' id='modif_categ_2' idcat='2' title='Categ2'></span><a href='accordion.php?tabs=2' name='2' title='2'>Categ 2</a></li>
</ul>
</div>
</body>
Here is the code I play in the document (accordion.php) called by ajax (with accordion in it):
- <?
echo "<div><ul>";
echo "<li class='accordion'>";
echo "<h3>Title of Accordion</h3>";
echo "<div>Content</div>";
echo "</li>"
echo "</ul></div>";
?>
1
