#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: |
Description
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"> <html> <head> <script src="jquery.js"></script> <script src="jquery.dimensions.js"></script> <script src="jquery.interface.js"></script> <script> $(document).ready(function(){ $("#myList").sortable({ 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); }); }); </script> <style> 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; } </style> </head> <body> <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> </ul> <div id="myListClicked">Double-click to get index.</div> <div id="myListDragged">Drag and drop to get index.</div> </body> </html>
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
Priority: | major → blocker |
---|
comment:2 Changed 14 years ago by
comment:3 Changed 14 years ago by
Resolution: | → invalid |
---|---|
Status: | new → closed |
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.
The effect can be simulated using the following snippit within the
update
handler: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.