So I will try to make this short and sweet.  Anyone who has the answer
to this will make my day :)

I have been using jQuery for a while now and ran into a new issue when
trying to ajaxify my UI a bit.

I have a DIV on the page that is called TRACKLIST.  Inside this sits a
UL with an ID of 'SortFiles'

I have the usual (document).ready code that initializes the SortFiles
element as being sortable.

In my AJAXing up the page, I have another set of buttons, that when
clicked call a custom function, that updates the TRACKLIST with a
fresh 'SortFiles' UL.

My problem is that this new SortFiles is not getting .sortable set on
it.  I can confirm this by Inspecting the DOM in Safari (dev mode) and
see that the newly loaded UL does not have a class="ui-sortable" on
it.

My code is below.  Thanks!

.....
This is the HTML as I originally wrote it

<div id="TrackList" style="width: 600px; height: 260px; overflow-x:
auto;">
<ul id="SortFiles">
<li id="listItem_123">Song</li>
<li id="listItem_124">Song 2</li>
...
If I use Sortables, and include the following JS

$(document).ready(function() {

    $("#SortFiles").sortable({
      update : function () {
                var order = $('#SortFiles').sortable('serialize');
                $("#sortableinfo").load("sortfiles.php?"+order);
      }
    });
}};

Then the HTML is updated at runtime as follows which is correct, my
items are sortable, and the auto update after sorting works as
expected.

<div id="TrackList" style="width: 600px; height: 260px; overflow-x:
auto;">
<ul id="SortFiles" class="ui-sortable">
<li id="listItem_123">Song</li>
<li id="listItem_124">Song 2</li>

.......

However if I then have a button that calls a new function called
SwapPlaylist.

The JS for that looks like this, and works as far as the DOM is
updated with the new UL which has been pulled in from another page.
The 'data' that is sent is the URL of the new playlist that has the
new SortFiles inside of it.

The problem is that this new version of SortFiles does not
have .sortables attached to it.  So you can see my feeble attempt to
call it.  I have actually tried like 5 different things, including
calling another function that calls the sortable, but I cant get it to
work.


    function SwapPlaylist(data){
                var TheUrl = data + ' #SortFiles';

                $('#TrackList').load(TheUrl);

                // What I figured should have worked:

                        $("#SortFiles").sortable();

    };

Please o wise jQuery masters, tell me what I am doing wrong.  Thanks a
trillion.

--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to 
[email protected]
For more options, visit this group at 
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to