addressValidation.js 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. /**
  2. * Copyright © Magento, Inc. All rights reserved.
  3. * See COPYING.txt for license details.
  4. */
  5. define([
  6. 'jquery',
  7. 'underscore',
  8. 'mageUtils',
  9. 'mage/translate',
  10. 'Magento_Checkout/js/model/postcode-validator',
  11. 'jquery/ui',
  12. 'validation'
  13. ], function ($, __, utils, $t, postCodeValidator) {
  14. 'use strict';
  15. $.widget('mage.addressValidation', {
  16. options: {
  17. selectors: {
  18. button: '[data-action=save-address]',
  19. zip: '#zip',
  20. country: 'select[name="country_id"]:visible'
  21. }
  22. },
  23. zipInput: null,
  24. countrySelect: null,
  25. /**
  26. * Validation creation
  27. *
  28. * @protected
  29. */
  30. _create: function () {
  31. var button = $(this.options.selectors.button, this.element);
  32. this.zipInput = $(this.options.selectors.zip, this.element);
  33. this.countrySelect = $(this.options.selectors.country, this.element);
  34. this.element.validation({
  35. /**
  36. * Submit Handler
  37. * @param {Element} form - address form
  38. */
  39. submitHandler: function (form) {
  40. button.attr('disabled', true);
  41. form.submit();
  42. }
  43. });
  44. this._addPostCodeValidation();
  45. },
  46. /**
  47. * Add postcode validation
  48. *
  49. * @protected
  50. */
  51. _addPostCodeValidation: function () {
  52. var self = this;
  53. this.zipInput.on('keyup', __.debounce(function (event) {
  54. var valid = self._validatePostCode(event.target.value);
  55. self._renderValidationResult(valid);
  56. }, 500)
  57. );
  58. this.countrySelect.on('change', function () {
  59. var valid = self._validatePostCode(self.zipInput.val());
  60. self._renderValidationResult(valid);
  61. });
  62. },
  63. /**
  64. * Validate post code value.
  65. *
  66. * @protected
  67. * @param {String} postCode - post code
  68. * @return {Boolean} Whether is post code valid
  69. */
  70. _validatePostCode: function (postCode) {
  71. var countryId = this.countrySelect.val();
  72. if (postCode === null) {
  73. return true;
  74. }
  75. return postCodeValidator.validate(postCode, countryId, this.options.postCodes);
  76. },
  77. /**
  78. * Renders warning messages for invalid post code.
  79. *
  80. * @protected
  81. * @param {Boolean} valid
  82. */
  83. _renderValidationResult: function (valid) {
  84. var warnMessage,
  85. alertDiv = this.zipInput.next();
  86. if (!valid) {
  87. warnMessage = $t('Provided Zip/Postal Code seems to be invalid.');
  88. if (postCodeValidator.validatedPostCodeExample.length) {
  89. warnMessage += $t(' Example: ') + postCodeValidator.validatedPostCodeExample.join('; ') + '. ';
  90. }
  91. warnMessage += $t('If you believe it is the right one you can ignore this notice.');
  92. }
  93. alertDiv.children(':first').text(warnMessage);
  94. if (valid) {
  95. alertDiv.hide();
  96. } else {
  97. alertDiv.show();
  98. }
  99. }
  100. });
  101. return $.mage.addressValidation;
  102. });