'select all' and 'remove all' with chosen.js

Question

For the select menu plugin chosen.js, is there an established way to add \'select all items in list\' or \'remove all items in list\' feature to a multiple select input? In

Answer 1

I realize this question is quite old, but I came upon a similar issue and wanted to share my result, as I like it's simplicity:

I created two buttons (all and none) and floated them left and right inside the div containing my select dropdown. The buttons look something like this:

All
None

Then I added some Jquery to handle the button actions:

$('#iAll').on('click', function(e){
  e.preventDefault();
  $('#iSelect option').prop('selected', true).trigger('chosen:updated');
});

$('#iNone').on('click', function(e){
  e.preventDefault();
  $("#iSelect option:selected").removeAttr("selected").trigger('chosen:updated');
});

Will probably need some cleaning up with regards to layout, but it's quite functional as is and I thought I'd share.