Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to prevent multiple selection in jQuery UI Selectable plugin

Tags:

I am using jQuery UI Selectable plugin. I want to select one item at a time. But jQuery UI Selectable plugin allows multiple selection by clicking/ dragging / holding CTRL key. Is there any way to prevent multiple selection?

like image 563
miti737 Avatar asked May 14 '09 05:05

miti737


2 Answers

What i did, is that i allow multiple selection but when the selection is done, i only keep the first element selected

<ul id="select">     <li>Row 1</li>     <li>Row 2</li>     <li>Row 3</li> </ul> 

This selects all the selected elements except the first one and deletes the selected status. So at the end, only one element will be selected. event.target corresponds to my ul element.

$('#select').selectable({     stop:function(event, ui){         $(event.target).children('.ui-selected').not(':first').removeClass('ui-selected');     } }); 

I know this topic is kinda old, but i still stumbled upon it, so it can be useful to someone else

like image 111
Lunfel Avatar answered Oct 11 '22 20:10

Lunfel


This worked for me. It prevents "lassoing" multiple rows and ctrl + click.

$(function() { $("#selectable").selectable({       selecting: function(event, ui){             if( $(".ui-selected, .ui-selecting").length > 1){                   $(ui.selecting).removeClass("ui-selecting");             }       } }); }); 
like image 29
kyle Avatar answered Oct 11 '22 21:10

kyle