jqueryUI Sortable: handling .disableSelection() on form inputs

Question

example: i have an un-ordered list containing a bunch of form inputs.

after making the ul .sortable(), I call .disableSelection() on the sortable (ul) to prevent text-selection when dragging an li item.

..all fine but I need to re/enable text-selection on the form inputs.. or the form is basically un-editable ..

i found a partial solution @ http://forum.jquery.com/topic/jquery-ui-sortable-disableselection-firefox-issue-with-inputs

• enableSelection, disableSelection seem still to be un-documented: http://wiki.jqueryui.com/Core

any thoughts?

Answer 1

solved . bit of hack but works! .. any comments how i can do this better?

apply .sortable() and then enable text-selection on input fields :

$("#list").sortable({
  stop: function () {
    // enable text select on inputs
    $("#list").find("input")
     .bind('mousedown.ui-disableSelection selectstart.ui-disableSelection', function(e) {
      e.stopImmediatePropagation();
    });
  }
}).disableSelection();

// enable text select on inputs
$("#list").find("input")
 .bind('mousedown.ui-disableSelection selectstart.ui-disableSelection', function(e) {
  e.stopImmediatePropagation();
});

Answer 2

A little improvement from post of Zack - jQuery Plugin

$.fn.extend({
    preventDisableSelection: function(){
        return this.each(function(i) {
            $(this).bind('mousedown.ui-disableSelection selectstart.ui-disableSelection', function(e) {
                e.stopImmediatePropagation();
            });
        });
    }
});

And full solution is:

$("#list").sortable({
  stop: function () {
    // enable text select on inputs
    $("#list").find("input").preventDisableSelection();
  }
}).disableSelection();

// enable text select on inputs
$("#list").find("input").preventDisableSelection();