Skip to content

Instantly share code, notes, and snippets.

@pacoguzman
Created June 1, 2011 10:20
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save pacoguzman/1002080 to your computer and use it in GitHub Desktop.
ASPGEMS JS BestPractices - MultiSelects
<select name="initiative[collaborator_ids][]" multiple="multiple" id="initiative_collaborator_ids" class="multiselect" style="display: none;">
<option value="5" selected="selected">usuario2@localmail.com</option>
<option value="7">fake_user1@domain.com</option>
<option value="8">fake_user2@domain.com</option>
<option value="9">fake_user3@domain.com</option>
<option value="10">fake_user4@domain.com</option>
<option value="11">fake_user5@domain.com</option>
<option value="12">fake_user6@domain.com</option>
<option value="13">fake_user7@domain.com</option>
<option value="14">fake_user8@domain.com</option>
<option value="15">fake_user9@domain.com</option>
<option value="18">usuario1@localmail.com</option>
</select>
<p id="related-categories">
<label for="card_related_categories">Categorías relacionadas</label>
<select name="card[related_categories][]" multiple="multiple" id="card_related_categories" data-multi-select="true">
<optgroup label="Brands">
<option value="card-automotive_brand">Automotive brand</option>
<option value="card-cosmetics_brand">Cosmetics brand</option>
</optgroup>
<optgroup label="Cinema">
<option value="card-actor">Actor</option>
<option value="card-character">Character</option>
<option value="card-director">Director</option>
<option value="card-movie">Movie</option>
</optgroup>
</select>
</p>
// http://quasipartikel.at/multiselect/
$.localise('ui-multiselect', {language: 'es', path: '/javascripts/locale/'});
$("#initiative_collaborator_ids").multiselect({ sortable: true, searchable: true });
// Multiselect Widget
// http://www.erichynds.com/jquery/jquery-ui-multiselect-widget/
// https://github.com/ehynds/jquery-ui-multiselect-widget
$("#related-categories select[data-multi-select]").multiselect({
header: false,
selectedList: 5
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment