Hiya,
I've a lil problem, I'm trying to destroy a sortable. But can't seem to make
it work. Maybe someone would be willing to run the code here below and see
what I'm doing wrong.. It should run no prob and I've marked
What it do?
It's just a static ul list with 5 items which are draggable to a trash. They
can be sorted when the user clicks Reorder. Then that option changes to
Update. When Update is hit I want it to revert to the original state where
items are only draggable to the trash but not sortable.
Thanks in advance,
Oli.
-- Code --
<script type="text/javascript" src="jquery-1.1.1.pack.js"></script>
<script type="text/javascript" src="interface.js"></script>
$(document).ready( function () {
$('#update').hide();
$('#reorder').click(function() {
$('li').DraggableDestroy();
$('ul').Sortable(
{
accept : 'sortableitem',
helperclass : 'sorthelper',
activeclass : 'sortableactive',
hoverclass : 'sortablehover',
opacity: 0.5,
ghosting: false,
fx: 800,
opacity: 0.5,
revert: true,
containment: 'document'
});
$('#update').show();
$('#reorder').hide();
return false;
});
$('#update').click(function() {
//serial = $.SortSerialize('sortables');
//alert(serial.hash);
// I've tried these and they don't work...
//$('li').SortableDestroy(); --> Casts an error
//$('sortables').SortableDestroy(); --> Casts an error
//$('#sortables').SortableDestroy(); --> Casts an error
$('li').Draggable(
{
autoSize:true,
ghosting:true,
revert:true,
fx: 200,
onStart:function()
{
$('#trash').addClass("dragtotrash");
},
onStop:function()
{
$('#trash').removeClass("dragtotrash");
}
});
$('#reorder').show();
$('#update').hide();
return false;
});
$('li').Draggable(
{
autoSize:true,
ghosting:true,
revert:true,
fx: 200,
onStart:function()
{
$('#trash').addClass("dragtotrash");
},
onStop:function()
{
$('#trash').removeClass("dragtotrash");
}
});
$("#trash").Droppable (
{
tolerance:"intersect",
accept:"sortableitem",
hoverclass:"dropzonehover",
activeclass:"sortableitem",
onDrop:function(drag)
{
var id = "#"+drag.id;
$(id).remove();
}
});
});
javascript:; Update
javascript:; Reorder
<ul id="sortables">
<li class="sortableitem" id="1">Item 1</li>
<li class="sortableitem" id="2"> http://www.jquery.com
http://www.jquery.com </li>
<li class="sortableitem" id="3">Item 3</li>
<li class="sortableitem" id="4"> http://www.nabble.com
http://www.nabble.com </li>
<li class="sortableitem" id="5">Item 5</li>
</ul>
<div id="trash">
Drag to trash
</div>
--
View this message in context:
http://www.nabble.com/Lil-problem-calling-SortableDestroy%28%29-tf3141718.html#a8707501
Sent from the JQuery mailing list archive at Nabble.com.
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
