Making ajax response sortable
Hi everyone,
I have the following code:
function layoutHandlers() {
//change layout
$('.layoutChoice').click(
function(e){
$.ajax({
url: "/layouts/editor/_site/"+$(this).attr('id')+".html",
success: function(html){
$('#content').html(html);
$('.panel').sortable({
accept: $('div.draggable'),
connectWith: $('div.panel'),
containment: 'document',
handle: '.header',
start: function(e, ui) {
ui.helper.css("width", ui.item.parent().innerWidth());
},
change: function(e, ui) {
var w = ui.element.width();
ui.placeholder.width(w);
ui.helper.css("width",ui.element.children().width());
}
}).bind("sortreceive", function(e, ui) {
$(ui.item).css("width", $(ui.item).parent().innerWidth()-2);
if ($(ui.item).is('.addHeader')) {
addHeader($(ui.item));
}
});
}
});
}
);
}
addLoadEvent(layoutHandlers);
However, when the request has been successfully completed, the divs
with class 'panel' are not being made sortable. Is this a limitation
of the UI API? Any other code that I place here that interfaces with
the loaded content (for example, $('.panel').css('background-color',
'#000')) works fine.
Thanks in advance,
kslat3r