Selectpicker with default selection

Question

I am using the selectpicker module. Now I'm trying to select all the default options or at least a button to select all, without having to click on the drop-down menu.

Currently, the demonstration only works if a click is invoked, then click the button.

Any idea?

$('.selectpicker').selectpicker(); $(".btn_clk").click(function () { $('.selectpicker').selectpicker('selectAll'); }); 

http://jsfiddle.net/tpnw96ed/

Answer 1

The solution in this thread works for me.

Here is the updated plugin code:

Line 888 and 895 in boostrapt-select.js

 selectAll: function () { this.findLis(); this.$lis.not('.divider').not('.disabled').not('.selected').not('.hide').find('a').click(); }, deselectAll: function () { this.findLis(); this.$lis.not('.divider').not('.disabled').filter('.selected').not('.hide').find('a').click(); }, 

Note that changing .filter(':visible') now .not('.hide')

Answer 2

You can open / close Selectpicker before / after clicking a button:

 $(".btn_clk").click(function () { $('.dropdown-menu').css("display","block"); $('.selectpicker').selectpicker('selectAll'); $('.dropdown-menu').css("display","none"); }); 

Edit: In addition, you will need to add the following to manually trigger a drop-down list of clicks after selectAll:

 $('.selectpicker').click(function () { if($('.dropdown-menu').css("display") == "block") $('.dropdown-menu').css("display","none"); else $('.dropdown-menu').css("display","block"); }); 

JSFIDDLE

Answer 3

Try the following:

  $('.selectpicker').selectpicker('val', ['Mustard','Relish', 'Ketchup']); 

Answer 4

By default, you can add the Select All and Uncheck All buttons to select now. You must use the option data-actions-box="true" to enable buttons and data-select-all-text="Select all buttton name" data-deselect-all-text="Deselect all button name" to rename them