Guest User

Untitled

a guest
Oct 15th, 2018
103
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 3.02 KB | None | 0 0
  1. ValidationModule = (function() {
  2. function validate(inputElement, validationsArray) {
  3. const validations = validationsArray;
  4. let messages = [];
  5.  
  6. function isNumber(input) {
  7. return !isNaN(parseFloat(input.value)) && isFinite(input.value);
  8. }
  9.  
  10. function isEmail(input) {
  11. var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;
  12.  
  13. return regex.test(input.value);
  14. }
  15.  
  16. function isEmpty(input) {
  17. return input.value.replace(/\s/g,"").length ? false : true;
  18. }
  19.  
  20. // ---------------------
  21.  
  22. for (let i = 0; i < validations.length; i++) {
  23.  
  24. switch (validations[i]) {
  25. case 'required':
  26. if ( isEmpty(inputElement) ) {
  27. messages.push(inputElement.dataset.errorText)
  28. }
  29. break;
  30.  
  31. case 'isNumber':
  32. if ( !isNumber(inputElement) ) {
  33. messages.push(inputElement.dataset.errorText)
  34. }
  35. break;
  36.  
  37. case 'isEmail':
  38. if ( !isEmail(inputElement) ) {
  39. messages.push(inputElement.dataset.errorText);
  40. }
  41. break;
  42.  
  43. default: console.error('invalid input data-validate value')
  44.  
  45. }
  46. }
  47. // console.log(messages.length ? messages : null)
  48. return messages.length ? messages : null;
  49. }
  50.  
  51. function showWarning(inputElement, messages, textColor) {
  52. inputElement.classList.add('js_containsError');
  53. let warningList = $('<ul class="js_warning-list"></ul>');
  54.  
  55. for (let i = 0; i < messages.length; i++) {
  56. let listElement = $("<li></li>").text(messages[i]);
  57. textColor ? listElement.css('color', textColor) : null;
  58. warningList.append(listElement)
  59. }
  60.  
  61. $(inputElement).after(warningList)
  62. }
  63.  
  64. function isValid(formElement) {
  65. const form = formElement instanceof jQuery ? formElement[0] : formElement;
  66. const inputs = form.querySelectorAll('[data-validate]');
  67. let errorsCounter = 0;
  68.  
  69. for (let i = 0; i < inputs.length; i++) {
  70. let errorMessages = [];
  71. let textColor = inputs[i].dataset.textColor;
  72.  
  73. $(inputs[i]).removeClass("js_containsError");
  74. $(inputs[i]).next('.js_warning-list').remove();
  75.  
  76. let validationsArray = [];
  77. let inputData = inputs[i].dataset.validate ? inputs[i].dataset.validate.split(' ') : false;
  78.  
  79. // ---------
  80. inputs[i].value = inputs[i].value.trim();
  81. // ---------
  82.  
  83. validationsArray = inputData ? inputData : null;
  84. // inputs[i].required ? validationsArray.push('required') : null;
  85.  
  86. if (validationsArray.length) {
  87. let validationResult = validate(inputs[i], validationsArray);
  88. validationResult ? errorMessages = validationResult : null;
  89. }
  90.  
  91. if (errorMessages.length) {
  92. showWarning(inputs[i], errorMessages, textColor);
  93. errorsCounter++;
  94. }
  95. }
  96.  
  97. return errorsCounter > 0 ? false : true;
  98. }
  99.  
  100. // ---------------
  101. return {
  102. isValid: isValid,
  103. }
  104. })();
  105.  
  106. // ---------Validation Script Test-------------
  107.  
  108. // $('body').on('click', 'button[type="submit"]', function(e) {
  109. // // console.log('ok')
  110. // e.preventDefault();
  111.  
  112. // // ValidationModule.isValid(this.form)
  113. // if( !ValidationModule.isValid(this.form) ) {
  114. // console.log('form not valid: ', this.form)
  115. // } else {
  116. // console.log('form valid: ', this.form)
  117. // }
  118. // });
Add Comment
Please, Sign In to add comment