CODEWITHSUNDEEP
javascriptjquery
user7244282
user7244282

Reputation:

Multi select jQuery-Dropdown plugin

I use this plugin. http://dane.one/projects/jquery-dropdown/demo/#multi-select https://github.com/daneWilliams/jquery.dropdown

I want use multiple select

$('select').dropdown({
   multi: true
});

It's working normal, but initially, when the page was loaded if I have selected options

<select multiple>
   <option>Option 1</option>
   <option selected>Option 2</option>
   <option>Option 3</option>
</select>

And I want add some selected options, This plugin resets all selected, and I then seleced And then chooses a new options without first selected.

Upvotes: 2

Views: 1021

Answers (2)

Pango
Pango

Reputation: 673

I'm not sure if I understood you correctly, but, it looks like the option is selected, it just doesn't look selected?

Here's a CodePen with three examples: http://codepen.io/anon/pen/mWWWaO

The first one is an example of what you have, the option is selected by adding the selected attribute in the code. It is selected, and when you select other options, it stays, but it is not highlighted like the other ones.

The second example is just an example of what it is like with nothing selected, this was more for my own reference and testing.

The third one is a menu with no options set as selected, but instead, after the plugin is initialized it triggers a click event on the option you want selected.

A quick look at the plugin and it didn't look like there was a way to initialize it with options already selected and it also looks like there is no way to select an option programmatically through the plugin.

The plugin replaces the original menu with it's own code in order to create the menu and it looks like an option can't look selected unless it is clicked on, as opposed to the actual, hidden, menu being updated within the code.

I included the plugin JS in the CodePen, but not here. You can scroll to the bottom there to see the example JS code. You would probably want to set up a better way to mark those items as selected than the quick example I set up, but that's the general idea.

$('select').dropdown({
    multi: true
});

// Select the third dropdown list and then find the second li in that list
$('.dropdown-list').eq(2).find('li').eq(1).trigger('click');

Upvotes: 1

user7687640
user7687640

Reputation:

Use select2 instead. Its an awesome jQuery plugin both for longlist single value selects & multiple selects.

Upvotes: 0

Related Questions