How to integrate jQuery UI.Layout Plug-in in AJAX site?
I successful used jQuery UI.Layout Plug-in in some test pages, but I failed when I tried to integrate layouts in an AJAX website.
When I load a page that uses layouts everything is Ok the first 开发者_JAVA技巧time, but the second time I try to load the same page layout plugin don't work. Simplifying I've noted that the problem is not AJAX, else the layout plugin. This is the simplest example I've found:
function m() {
$("body").html('xxx');
}
function m2() {
$("body").html('<div class="ui-layout-west">west</div><div class="ui-layout-east">east</div><div id="mainContent"></div>')
outerLayout = $("body").layout( layoutSettings_Outer );
}
$(document).ready( function() {
m2();
setTimeout("m()", 3000);
setTimeout("m2()", 5000);
});
When the document is loaded, the layout is ok. After 3 seconds the layout disapears (as expected), and 2 seconds later the original page is back, but every DIV works as if the layout plugin is not loaded.
I'll answer my own question:
outerLayout.destroy() resolves the problem. It must be called if you unload any layout DIV. In this case, it is enough to call destroy() just before $("body").html('xxx'); (first line in m() function).
精彩评论