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.telephone.js

62 lines
1.9 KiB
JavaScript
Raw Normal View History

2017-03-16 15:29:07 +00:00
/**
* @file
2018-11-23 12:29:20 +00:00
* JavaScript behaviors for Telephone element.
2017-03-16 15:29:07 +00:00
*/
(function ($, Drupal, drupalSettings) {
'use strict';
2018-11-23 12:29:20 +00:00
// @see https://github.com/jackocnr/intl-tel-input#options
Drupal.webform = Drupal.webform || {};
Drupal.webform.intlTelInput = Drupal.webform.intlTelInput || {};
Drupal.webform.intlTelInput.options = Drupal.webform.intlTelInput.options || {};
2017-03-16 15:29:07 +00:00
/**
* Initialize Telephone international element.
* @see http://intl-tel-input.com/node_modules/intl-tel-input/examples/gen/is-valid-number.html
* @type {Drupal~behavior}
*/
Drupal.behaviors.webformTelephoneInternational = {
attach: function (context) {
2018-11-23 12:29:20 +00:00
if (!$.fn.intlTelInput) {
return;
}
2017-03-16 15:29:07 +00:00
$(context).find('input.js-webform-telephone-international').once('webform-telephone-international').each(function () {
var $telephone = $(this);
// Add error message container.
var $error = $('<div class="form-item--error-message">' + Drupal.t('Invalid phone number') + '</div>').hide();
2018-11-23 12:29:20 +00:00
$telephone.closest('.js-form-item').append($error);
2017-03-16 15:29:07 +00:00
// @todo: Figure out how to lazy load utilsScript (build/js/utils.js).
// @see https://github.com/jackocnr/intl-tel-input#utilities-script
2018-11-23 12:29:20 +00:00
var options = $.extend({
nationalMode: false,
initialCountry: $telephone.attr('data-webform-telephone-international-initial-country') || ''
}, Drupal.webform.intlTelInput.options);
$telephone.intlTelInput(options);
2017-03-16 15:29:07 +00:00
2018-11-23 12:29:20 +00:00
var reset = function () {
2017-03-16 15:29:07 +00:00
$telephone.removeClass('error');
$error.hide();
};
2018-11-23 12:29:20 +00:00
$telephone.blur(function () {
2017-03-16 15:29:07 +00:00
reset();
if ($.trim($telephone.val())) {
if (!$telephone.intlTelInput('isValidNumber')) {
$telephone.addClass('error');
$error.show();
}
}
});
$telephone.on('keyup change', reset);
2018-11-23 12:29:20 +00:00
});
2017-03-16 15:29:07 +00:00
}
};
})(jQuery, Drupal, drupalSettings);