Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- (function ($) {
- // Alter chosen markup for dropdowns with icons.
- $('.dropdown--hasIcons .dropdown__select').on('chosen:showing_dropdown', function (event, data) {
- // Since items are not initially created in DOM we will alter the markup on dropdown show.
- var resultsData = data.chosen.results_data,
- $dropdownItems = data.chosen.dropdown.find('li');
- resultsData.forEach(function (result, i) {
- $dropdownItems.eq(i).prepend('<i class="dropdown__icon dropdown__icon-' + result.value + '"></i>')
- });
- }).on('chosen:ready', function (event, data) {
- // We also need to prepend a icon for selected
- // item which is available on chosen ready.
- var $chosenSelectedItem = data.chosen.selected_item,
- resultsData = data.chosen.results_data;
- $chosenSelectedItem.prepend('<i class="dropdown__icon dropdown__icon-' + resultsData[0].value + '"></i>');
- }).on('chosen:hiding_dropdown', function (event, data) {
- // Update selected item icon after we select an option(which leads to dropdown hide event).
- var $chosenSelectedItem = data.chosen.selected_item,
- selectedLanguage = $(event.target).find(':selected').val(),
- resultsData = data.chosen.results_data,
- selectedLanguageIndex = data.chosen.current_selectedIndex;
- $chosenSelectedItem
- .find('.dropdown__icon')
- .removeClass('dropdown__icon-' + resultsData[selectedLanguageIndex].value)
- .addClass('dropdown__icon-' + selectedLanguage);
- });
- // Chosen initialization.
- $('.js-chosen').chosen({
- "disable_search": true,
- "inherit_select_classes": true,
- "width": "100%"
- });
- })(jQuery);
Add Comment
Please, Sign In to add comment