This repository has been archived on 2025-01-19. You can view files and clone it, but cannot push or open issues or pull requests.
drupalcampbristol/web/modules/contrib/webform/js/webform.element.select2.js
2018-11-23 12:29:20 +00:00

74 lines
2 KiB
JavaScript

/**
* @file
* JavaScript behaviors for Select2 integration.
*/
(function ($, Drupal) {
'use strict';
// @see https://select2.github.io/options.html
Drupal.webform = Drupal.webform || {};
Drupal.webform.select2 = Drupal.webform.select2 || {};
Drupal.webform.select2.options = Drupal.webform.select2.options || {};
/**
* Initialize Select2 support.
*
* @type {Drupal~behavior}
*/
Drupal.behaviors.webformSelect2 = {
attach: function (context) {
if (!$.fn.select2) {
return;
}
$(context)
.find('select.js-webform-select2, .js-webform-select2 select')
.once('webform-select2')
// http://stackoverflow.com/questions/14313001/select2-not-calculating-resolved-width-correctly-if-select-is-hidden
.css('width', '100%')
.each(function () {
var $select = $(this);
var options = $.extend({}, Drupal.webform.select2.options);
if ($select.data('placeholder')) {
options.placeholder = $select.data('placeholder');
if (!$select.prop('multiple')) {
// Allow single option to be deselected.
options.allowClear = true;
}
}
$select.select2(options);
});
}
};
/**
* ISSUE:
* Hiding/showing element via #states API cause select2 dropdown to appear in the wrong position.
*
* WORKAROUND:
* Close (aka hide) select2 dropdown when #states API hides or shows an element.
*
* Steps to reproduce:
* - Add custom 'Submit button(s)'
* - Hide submit button
* - Save
* - Open 'Submit button(s)' dialog
*
* Dropdown body is positioned incorrectly when dropdownParent isn't statically positioned.
* @see https://github.com/select2/select2/issues/3303
*/
$(function () {
if ($.fn.select2) {
$(document).on('state:visible state:visible-slide', function (e) {
$('select.select2-hidden-accessible').select2('close');
});
}
});
})(jQuery, Drupal);