Question

I have a simple code example @ http://jsbin.com/ukiwo3/edit

It has 2 connected lists and a load of bound events. I’m hopeful I’ve missed something simple as based on http://jqueryui.com/demos/sortable/ Events I think I should see all these events fired when I drag and reorder a question li. At the moment only sort logs to the console.

Can anyone tell me whats wrong and how to get the rest to fire?

Thanks,
Denis

Answer 1

The events are named differently when binding, for example sortstart instead of start. Look at the list of events on the demo page for a full list of what your binds should be.

Overall, it should look like this:

$( ".questions" ).bind( "sortstop", function(event, ui) {
  console.log("stop event");
});
$( ".questions" ).bind( "sortstart", function(event, ui) {
  console.log("start event");
});
$( ".questions" ).bind( "sortchange", function(event, ui) {
  console.log("change event");
});
$( ".questions" ).bind( "sort", function(event, ui) {
  console.log("sort event");
});
$( ".questions" ).bind( "sortremove", function(event, ui) {
  console.log("remove event");
});
$( ".questions" ).bind( "sortout", function(event, ui) {
  console.log("out event");
});
$( ".questions" ).bind( "sortover", function(event, ui) {
  console.log("over event");
});
$( ".questions" ).bind( "sortupdate", function(event, ui) {
  console.log("update event");
});

(not optimized, just showing event names)