How do I make elements in jQuery Selectable deselected?

Question

How do I make elements in jQuery Selectable deselected? At this Link it is well documented how to use jQuery Selectable but it is never mentioned how to deselect selected elements again. Any ideas?

<script>
$(function() {
    $( "#selectable" ).selectable({
        stop: function() {
            var result = $( "#select-result" ).empty();

            $( ".ui-selected", this ).each(function() {
                var index = $( "#selectable li" ).index( this );
                result.append( " #" + ( index + 1 ) );
            });
        }
    });
});
</script>

<ol id="selectable">
    <?php
        for($i=1;$i<=9;$i++) {
            echo "<li id=\"field_$i\" class=\"ui-state-default\">$i</li>";
        }
    ?>
</ol>

You mean programatically? Because you can hold the control key down and click a selected element to de-select it. — j08691, Jul 28 '14 at 14:26
You can just remove the class that gets added to a selected list item, `ui-selected`. — j08691, Jul 28 '14 at 14:32
No success with "$('#selectable .ui-selected').removeClass('ui-selected');" — user3524628, Jul 28 '14 at 14:43
Works for me. http://jsfiddle.net/j08691/7FV6J/. Select the whole list and then wait a couple of seconds. — j08691, Jul 28 '14 at 14:47

score 1 · Answer 1 · answered Jul 28 '14 at 14:24

1

Hold ctrl and click on the elements. It can also be used to make multiple selections.

answered Jul 28 '14 at 14:24

Populus

7,470
3
38
54

I would like to code it like: if one element in selectable is selected then deselect it. – user3524628 Jul 28 '14 at 14:31
Yes I did have a look, also in the API. – user3524628 Jul 28 '14 at 14:56
http://stackoverflow.com/questions/5718493/how-to-implement-toggle-functionality-on-jquery-ui-selectable – Populus Jul 28 '14 at 15:52

How do I make elements in jQuery Selectable deselected?

1 Answers1