Bug Tracker

Opened 14 years ago

Closed 14 years ago

Last modified 11 years ago

#2730 closed bug (invalid)

Unable to retreive index of sortable element during update event.

Reported by: GothAlice Owned by: paul
Priority: undecided Milestone:
Component: ui Version: 1.2.3
Keywords: sortables Cc:
Blocked by: Blocking:


At no point during the internal handler for the stop event can the index for the current / last modified element be retrieved, thus the index of said element can not be retrieved from within any scripted update handler. The following code does not work, but should:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
        <script src="jquery.js"></script>
        <script src="jquery.dimensions.js"></script>
        <script src="jquery.interface.js"></script>

                    handle: 'b',
                    update: function(e, ui){
                        var index = $(ui.element).children().index(ui.item);
                        $("div#myListDragged").text("That was a div with new index #" + index);
                $("li").dblclick(function () {
                    var index = $("#myList li").index(this);
                    $("div#myListClicked").text("That was div index #" + index);
            ul { list-style: none; }
            li { background: #727EA3; color: #FFF; width: 100px; margin: 5px; font-size: 10px; font-family: Arial; padding: 3px; }
            b { cursor: move; }
            div { color: red; }
        <ul id="myList">
            <li><b>Handle</b> Item 1</li>
            <li><b>Handle</b> Item 2</li>
            <li><b>Handle</b> Item 3</li>
            <li><b>Handle</b> Item 4</li>
        <div id="myListClicked">Double-click to get index.</div>
        <div id="myListDragged">Drag and drop to get index.</div>

The above is a combination of two pre-existing examples; one on the sample usage of the index method, the other on using sortables. Double-clicking the non-handle part of a list item works correctly.

I have tested this in both the current 'stable' and latest development snapshot.

Not being able to utilize index offsets makes the callback generally useless for my purposes, as my behind-the-scenes AJAX code only requires the ID of the node and the new offset to update the database.

Change History (3)

comment:1 Changed 14 years ago by rworth

Priority: majorblocker

comment:2 Changed 14 years ago by GothAlice

The effect can be simulated using the following snippit within the update handler:

var index = $.inArray(ui.item.attr('id'), ui.instance.toArray())

I'm not sure how efficient this is, or if this will work for anything other than the simple test case, but it works. The element seemingly not being a child element of the container is still a problem, though, and this is a hack.

comment:3 Changed 14 years ago by paul

Resolution: invalid
Status: newclosed

Hi there, the fix is really simple, it's not an issue in UI: the index() method cannot accept jQuery sets, and ui.item is a jQuery collection. change ui.item to ui.item[0] and it will work.

Note: See TracTickets for help on using tickets.