one little addition to markup add an id ="list" to ul due to $sortable requirements
$("#section_list li:not('li ul li')").each( function(i) {
position= i+1
myId="foo_"+position
$(this).attr("id",myId);
});
$("#list").sortable();
$("button").click(function() {
var result = $('#list').sortable('toArray');// this returns id's in order they appear after sort, parse out the foo_
alert(result);
});
i don't understand the MPTT stuff, or implications but hope this helps
brian wrote:
Given the following structure:
<div id="section_list">
<ul id="list">
<li></li>
<li>
<ul>
<li></li>
</ul>
</li>
<li>
<ul>
<li></li>
</ul>
</li>
</ul>
</div>
How should I select just the top-level list items? I thought
'#section_list > ul > li' should do it but it doesn't appear to be so.
At least, the code I've got is giving me strange results. I'd like to
confirm whether my selector is good or not.
What I'm trying to do is get the position of a list item (only looking
at the top level). I'm using sortable and need to be able to get the
start and end positions of the item so i can update the database. What
I've come up with so far is to call this function from sortable's
start callback. It seems like an ugly way to go about this but I'm a
bit stumped as to a better way.
function getStartPosition(id)
{
var position = 0;
$('#section_list > ul > li').each(function(indx, el)
{
if ($(el).attr('id') == id) { position = indx + 1; }
});
return position;
}
Not only does it look hacky, but it's giving me obviously bad results.
To complicate things further, I'm using MPTT for my tree data, so
sortable's serialize isn't much help, unfortunately. I originally
thought I might figure out the parent_id, lft, and rght values upon
sort but that would entail storing all that data somewhere in the DOM.
I then realized that, if I can just get the number of positions moved,
I could update the DB with that information.
All this to say that, if someone else has tackled this, I'd really
appreciate some pointers.
|
