skillilea
asked on
Sortable (JQUI): Don't allow items to be dragged above non sortable items.
Ok before I write a bunch of code to catch and loop. Any ideas on how to do this.
I have a UL that returns items. They will always come back with "standard" items first then custom.
I have locked the standard ones down so they can't be moved/sorted in the list.
The issue is: I don't want any custom ones to be able to be dragged above the standard ones.
Looks like this:
currently I sort with this:
thanks in advance
I have a UL that returns items. They will always come back with "standard" items first then custom.
I have locked the standard ones down so they can't be moved/sorted in the list.
The issue is: I don't want any custom ones to be able to be dragged above the standard ones.
Looks like this:
<ul id="jqWidSelected" class="jqSortableDash ui-sortable">
<li class="dBBBorBottom fixed dBBAlt" data-id="AE10BCF3-B2C0-474C-BA27-750426330529" style="height:70px;">
<li class="dBBBorBottom fixed" data-id="C30D2FAC-AE62-43D0-A833-73B5A67F2494" style="height:70px;">
<li class="dBBBorBottom dBBAlt" data-id="E0FE32F2-795E-4435-A117-EAFD28718FFD" style="height:70px;">
<li class="dBBBorBottom " data-id="8392F1B2-7115-4575-A230-611D55AC0140" style="height:70px;">
<li class="dBBBorBottom dBBAlt" data-id="066E3E2D-1182-4E39-B6BD-4BBE7659A2C3" style="height:70px;">
<li class="dBBBorBottom " data-id="2C0F5B37-824B-4D08-BFA0-1D2C0940F91F" style="height:70px;">
</ul>
NOTE: fixed on LI determines locked or disabled
currently I sort with this:
// handle drag sort for dash order SORT
$('.jqSortableDash').sortable({
cancel: ".fixed",
delay: 100,
//connectWith: ".handleDrag",
stop: function (event, ui) {
p.HandleSortDash(ui, ui.item)
},
start: function (event, ui) { }
}).disableSelection();
which calls this...basically just handles the order to the DB
//------------------------- HANDLE SORT DASH ------------------------------------------------------------ //
//
IPpage.prototype.HandleSortDash = function (ui, e) {
var orderBy = '';
$('#jqWidSelected li').each(function (i) {
var n = $(this);
n.find('.jqNum').html((i + 1));
orderBy += '|' + n.attr('data-id');
});
// update db
this.HandleDBPreferenceCRUD(orderBy, 50);
return;
}v
thanks in advance
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
AWESOME!
Thanks tons! Crazy simple.
Thanks tons! Crazy simple.
there are great jQuery plugin for that kind of situation.
Footable
http://themergency.com/footable/
Datatable
http://datatables.net/