jQuery UI Selectable - unselect selected item on click

Question

Does anyone know if there\'s a way to configure a jquery ui selectable element to unselect the selected element when you click it? Sort of like a toggle. If it\'s already

Answer 1

If you want that existing selections be preserved and yet have the toggle operation, you simply need to ignore the unselected event for the solution given. Also you need to remove the ui-selected class.

$("#selectable").selectable({
selected: function (event, ui) {
    if ($(ui.selected).hasClass('selectedfilter')) {
        $(ui.selected).removeClass('selectedfilter').removeClass('ui-selected');
        // do unselected stuff
    } else {            
        $(ui.selected).addClass('selectedfilter').addClass('ui-selected');
        // do selected stuff
    }
}
});