CODEWITHSUNDEEP
javascriptjquery
Sheils
Sheils

Reputation: 333

How to use PATRICK SPRINGSTUBBE jQuery multiselect plugin for single select

I am using Patrick Springstubbe multiselect pluging and it works fine. But now I would like to use it for single select. I know I need to set the select to mulitple for the plugin to work. But is there a way to limit the number of option to 1.

I have tried 

$("#ProductCategory").change(function(){

  $(".ms-options").css("visibility","hidden");
  
  }

This gives the desired effect when you select an option but then you can reopen the list. I have tried using a function on $("#ProductCategory").click but this did not work.

Upvotes: 6

Views: 638

Answers (2)

Kavindra
Kavindra

Reputation: 1707

According to the github repository of the library (https://github.com/nobleclem/jQuery-MultiSelect), you can't do that at the moment. In 'jquery.multiselect.js' file in the code, the author has mentioned that it is a feature coming in the future. These are line numbers 74-76 in the code.

// @NOTE: these are for future development

minSelect: false, // minimum number of items that can be selected

maxSelect: false, // maximum number of items that can be selected

Therefore, you can't achieve that with this library. Instead, you can use another library that offers both features. I suggest you to use one of these;

http://davidstutz.de/bootstrap-multiselect/

https://developer.snapappointments.com/bootstrap-select/examples/

They both have the muliple-select and single-select options.

Upvotes: 0

AarónBC.
AarónBC.

Reputation: 1330

As Kavindra sugested, it is better to look for a plugin that already does the job you need.

In case you still want to use that plugin and have single selection you can try this:

$('#mySelect').next().find('input[id^="ms-opt"]').click(function(){ 
   $('.ms-options input[id^="ms-opt"]:checked').not(this).click(); 
})

Here's the fiddle: https://jsfiddle.net/1jfwp81d/3/

I added two selects, one with single and another with multiple selection working together.

Note that this is a hack and might not work with newer versions of the plugin.

Upvotes: 4

Related Questions