(function($) { // ***************** Add and Remove message ******** function addMessage(_currentForm, _ruleId, _rule, _ruleValue) { let _nextElement = document.querySelector('#' + _ruleId) rules[_currentForm][_ruleId]['isValid'] = false if (_nextElement.nextElementSibling) { _nextElement = _nextElement.nextElementSibling if (_nextElement.classList.contains('error')) { if (messages[_currentForm][_ruleId] && messages[_currentForm][_ruleId][_rule]) { if (typeof messages[_currentForm][_ruleId][_rule] == 'function') { _nextElement.textContent = messages[_currentForm][_ruleId][_rule]() _nextElement.setAttribute('data-rule', _rule) } else { _nextElement.textContent = messages[_currentForm][_ruleId][_rule] _nextElement.setAttribute('data-rule', _rule) } } else { if (_rule == 'minlength' || _rule == "maxlength" || _rule == 'minFileSize' || _rule == "maxFileSize" || _rule == "allowedTypes") { _nextElement.textContent = defaultMessages[_rule].replace("0", _ruleValue) _nextElement.setAttribute('data-rule', _rule) } else { _nextElement.textContent = defaultMessages[_rule] _nextElement.setAttribute('data-rule', _rule) } } } else { if (messages[_currentForm][_ruleId] && messages[_currentForm][_ruleId][_rule]) { let label = document.createElement('label') label.setAttribute('for', _ruleId) label.setAttribute('data-rule', _rule) label.classList.add('error') if (typeof messages[_currentForm][_ruleId][_rule] == 'function') { label.innerText = messages[_currentForm][_ruleId][_rule]() } else { label.innerText = messages[_currentForm][_ruleId][_rule] } $(label).insertAfter('#' + _ruleId); } else { let label = document.createElement('label') label.setAttribute('for', _ruleId) label.setAttribute('data-rule', _rule) label.classList.add('error') if (_rule == 'minlength' || _rule == "maxlength" || _rule == 'minFileSize' || _rule == "maxFileSize" || _rule == "allowedTypes") { label.innerText = defaultMessages[_rule].replace("0", _ruleValue) } else { label.innerText = defaultMessages[_rule] } $(label).insertAfter('#' + _ruleId) } } } else { if (_nextElement.classList.contains('error')) { if (messages[_currentForm][_ruleId] && messages[_currentForm][_ruleId][_rule]) { if (typeof messages[_currentForm][_ruleId][_rule] == 'function') { _nextElement.textContent = messages[_currentForm][_ruleId][_rule]() _nextElement.setAttribute('data-rule', _rule) } else { _nextElement.textContent = messages[_currentForm][_ruleId][_rule] _nextElement.setAttribute('data-rule', _rule) } } else { if (_rule == 'minlength' || _rule == "maxlength" || _rule == 'minFileSize' || _rule == "maxFileSize" || _rule == "allowedTypes") { _nextElement.textContent = defaultMessages[_rule].replace("0", _ruleValue) _nextElement.setAttribute('data-rule', _rule) } else { _nextElement.textContent = defaultMessages[_rule] _nextElement.setAttribute('data-rule', _rule) } } } else { if (messages[_currentForm][_ruleId] && messages[_currentForm][_ruleId][_rule]) { let label = document.createElement('label') label.setAttribute('for', _ruleId) label.setAttribute('data-rule', _rule) label.classList.add('error') if (typeof messages[_currentForm][_ruleId][_rule] == 'function') { label.innerText = messages[_currentForm][_ruleId][_rule]() } else { label.innerText = messages[_currentForm][_ruleId][_rule] } $(label).insertAfter('#' + _ruleId) } else { let label = document.createElement('label') label.setAttribute('for', _ruleId) label.setAttribute('data-rule', _rule) label.classList.add('error') if (_rule == 'minlength' || _rule == "maxlength" || _rule == 'minFileSize' || _rule == "maxFileSize" || _rule == "allowedTypes") { label.innerText = defaultMessages[_rule].replace("0", _ruleValue) } else { label.innerText = defaultMessages[_rule] } $(label).insertAfter('#' + _ruleId) } } } } function removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { let _nextElement = document.querySelector('#' + _ruleId) if (_nextElement.nextElementSibling) { _nextElement = _nextElement.nextElementSibling if (_nextElement.classList.contains('error')) { if (messages[_currentForm][_ruleId]) { if (messages[_currentForm][_ruleId][_rule]) { if (typeof messages[_currentForm][_ruleId][_rule] == 'function') { if (_nextElement.textContent == messages[_currentForm][_ruleId][_rule]() && _nextElement.getAttribute('data-rule') == _rule) { if (rules[_currentForm][_ruleId]['required']) { if (_currentElement.val() != '') { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } else { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } } else { if (_nextElement.textContent == messages[_currentForm][_ruleId][_rule] && _nextElement.getAttribute('data-rule') == _rule) { if (rules[_currentForm][_ruleId]['required']) { if (_currentElement.val() != '') { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } else { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } } } else { if (_rule != 'minlength' && _rule != 'maxlength' && _rule != 'minFileSize' && _rule != 'maxFileSize' && _rule != 'allowedTypes') { if (_nextElement.textContent == defaultMessages[_rule]) { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } else { if (_nextElement.textContent == defaultMessages[_rule].replace("0", _ruleValue)) { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } } } else { if (_rule != 'minlength' && _rule != 'maxlength' && _rule != 'minFileSize' && _rule != 'maxFileSize' && _rule != 'allowedTypes') { if (_nextElement.textContent == defaultMessages[_rule]) { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } else { if (_nextElement.textContent == defaultMessages[_rule].replace("0", _ruleValue)) { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } } } } else { if (_nextElement.classList.contains('error')) { if (messages[_currentForm][_ruleId]) { if (messages[_currentForm][_ruleId][_rule]) { if (typeof messages[_currentForm][_ruleId][_rule] == 'function') { if (_nextElement.textContent == messages[_currentForm][_ruleId][_rule]() && _nextElement.getAttribute('data-rule') == _rule) { if (rules[_currentForm][_ruleId]['required']) { if (_currentElement.val() != '') { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } else { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } } else { if (_nextElement.textContent == messages[_currentForm][_ruleId][_rule] && _nextElement.getAttribute('data-rule') == _rule) { if (rules[_currentForm][_ruleId]['required']) { if (_currentElement.val() != '') { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } else { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } } } else { if (_rule != 'minlength' && _rule != 'maxlength' && _rule != 'minFileSize' && _rule != 'maxFileSize' && _rule != 'allowedTypes') { if (_nextElement.textContent == defaultMessages[_rule] && _nextElement.getAttribute('data-rule') == _rule) { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } else { if (_nextElement.textContent == defaultMessages[_rule].replace("0", _ruleValue) && _nextElement.getAttribute('data-rule') == _rule) { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } } } else { if (_rule != 'minlength' && _rule != 'maxlength' && _rule != 'minFileSize' && _rule != 'maxFileSize' && _rule != 'allowedTypes') { if (_nextElement.textContent == defaultMessages[_rule] && _nextElement.getAttribute('data-rule') == _rule) { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } else { if (_nextElement.textContent == defaultMessages[_rule].replace("0", _ruleValue) && _nextElement.getAttribute('data-rule') == _rule) { rules[_currentForm][_ruleId]['isValid'] = true _nextElement.remove() } } } } } } function addCheckRadioMessages(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { rules[_currentForm][_ruleId]['isValid'] = false let _lastElement = $(_currentElement).parent()[0].lastElementChild if (_lastElement.classList.contains('error')) { if (messages[_currentForm][_ruleId] && messages[_currentForm][_ruleId][_rule]) { if (typeof messages[_currentForm][_ruleId][_rule] == 'function') { _lastElement.textContent = messages[_currentForm][_ruleId][_rule]() _lastElement.setAttribute('data-rule', _rule) } else { _lastElement.textContent = messages[_currentForm][_ruleId][_rule] _lastElement.setAttribute('data-rule', _rule) } } else { if (_rule == 'minRequired' || _rule == "maxRequired") { _lastElement.textContent = defaultMessages[_rule].replace("0", _ruleValue) _lastElement.setAttribute('data-rule', _rule) } else { _lastElement.textContent = defaultMessages[_rule] _lastElement.setAttribute('data-rule', _rule) } } } else { let label = document.createElement('label') label.setAttribute('for', _ruleId) label.setAttribute('data-rule', _rule) label.classList.add('error') if (messages[_currentForm][_ruleId] && messages[_currentForm][_ruleId][_rule]) { if (typeof messages[_currentForm][_ruleId][_rule] == 'function') { label.innerText = messages[_currentForm][_ruleId][_rule]() } else { label.innerText = messages[_currentForm][_ruleId][_rule] } $(label).insertAfter($(_lastElement)) } else { if (_rule == 'minRequired' || _rule == "maxRequired") { label.innerText = defaultMessages[_rule].replace("0", _ruleValue) } else { label.innerText = defaultMessages[_rule] } $(label).insertAfter($(_lastElement)) } } } function removeCheckRadioMessages(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { let _lastElement = $(_currentElement).parent()[0].lastElementChild if (_lastElement.classList.contains('error')) { if (messages[_currentForm][_ruleId]) { if (messages[_currentForm][_ruleId][_rule]) { if (typeof messages[_currentForm][_ruleId][_rule] == 'function') { if (_lastElement.textContent == messages[_currentForm][_ruleId][_rule]() && _lastElement.getAttribute('data-rule') == _rule) { rules[_currentForm][_ruleId]['isValid'] = true _lastElement.remove() } } else { if (_lastElement.textContent == messages[_currentForm][_ruleId][_rule] && _lastElement.getAttribute('data-rule') == _rule) { rules[_currentForm][_ruleId]['isValid'] = true _lastElement.remove() } } } else { if (_rule != 'minRequired' && _rule != 'maxRequired') { if (_lastElement.textContent == defaultMessages[_rule] && _lastElement.getAttribute('data-rule') == _rule) { rules[_currentForm][_ruleId]['isValid'] = true _lastElement.remove() } } else { if (_lastElement.textContent == defaultMessages[_rule].replace("0", _ruleValue) && _lastElement.getAttribute('data-rule') == _rule) { rules[_currentForm][_ruleId]['isValid'] = true _lastElement.remove() } } } } else { if (_rule != 'minRequired' && _rule != 'minRequired') { if (_lastElement.textContent == defaultMessages[_rule] && _lastElement.getAttribute('data-rule') == _rule) { rules[_currentForm][_ruleId]['isValid'] = true _lastElement.remove() } } else { if (_lastElement.textContent == defaultMessages[_rule].replace("0", _ruleValue) && _lastElement.getAttribute('data-rule') == _rule) { rules[_currentForm][_ruleId]['isValid'] = true _lastElement.remove() } } } } } // *****************End of Add And Remove Message ************* // ******************* Checking Rules ********************** function checkRequired(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { if (_ruleValue) { if (_currentElement.val() == '' || _currentElement.val() == null) { addMessage(_currentForm, _ruleId, _rule, _ruleValue) } else if (_currentElement.val() !== '' || _currentElement.val() !== null) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } } function checkMinLength(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { if (_ruleValue) { if (_currentElement.val() !== '' && _currentElement.val() !== null && _currentElement.val().length < _ruleValue) { addMessage(_currentForm, _ruleId, _rule, _ruleValue) } else if (rules[_currentForm][_ruleId]['maxlength']) { if (_currentElement.val() == '' || _currentElement.val() == null || (_currentElement.val().length >= _ruleValue && _currentElement.val().length <= rules[_currentForm][_ruleId]['maxlength'])) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } else { if (_currentElement.val() == '' || _currentElement.val() == null || _currentElement.val().length >= _ruleValue) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } } } function checkMaxLength(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { if (_ruleValue) { if (_currentElement.val() !== '' && _currentElement.val() !== null && _currentElement.val().length > _ruleValue) { addMessage(_currentForm, _ruleId, _rule, _ruleValue) } else if (rules[_currentForm][_ruleId]['minlength']) { if (_currentElement.val() == '' || _currentElement.val() == null || (_currentElement.val().length <= _ruleValue && _currentElement.val().length >= rules[_currentForm][_ruleId]['minlength'])) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } else { if (_currentElement.val() == '' || _currentElement.val() == null || _currentElement.val().length <= _ruleValue) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } } } function checkDigits(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { if (_ruleValue) { if (_currentElement.val() !== '' && _currentElement.val() !== null && !/^[0-9]+$/.test(_currentElement.val())) { addMessage(_currentForm, _ruleId, _rule, _ruleValue) } else if (_currentElement.val() == '' || _currentElement.val() == null || /^[0-9]+$/.test(_currentElement.val())) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } } function checkEmail(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { if (_ruleValue) { if (_currentElement.val() !== '' && _currentElement.val() !== null && !/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(_currentElement.val())) { addMessage(_currentForm, _ruleId, _rule, _ruleValue) } else if (_currentElement.val() == '' || _currentElement.val() == null || /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(_currentElement.val())) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } } function checkURL(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { if (_ruleValue) { if (_currentElement.val() !== '' && _currentElement.val() !== null && !/(?:https?):\/\/(\w+:?\w*)?(\S+)(:\d+)?(\/|\/([\w#!:.?+=&%!\-\/]))?/.test(_currentElement.val())) { addMessage(_currentForm, _ruleId, _rule, _ruleValue) } else if (_currentElement.val() == '' || _currentElement.val() == null || /(?:https?):\/\/(\w+:?\w*)?(\S+)(:\d+)?(\/|\/([\w#!:.?+=&%!\-\/]))?/.test(_currentElement.val())) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } } function checkDate(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { if (_ruleValue) { if (_currentElement.val() !== '' && _currentElement.val() !== null && !/^[0-9]{2}[\-/][0-9]{2}[\-/][0-9]{4}$/g.test(_currentElement.val())) { addMessage(_currentForm, _ruleId, _rule, _ruleValue) } else if (_currentElement.val() == '' || _currentElement.val() == null || /^[0-9]{2}[\-/][0-9]{2}[\-/][0-9]{4}$/g.test(_currentElement.val())) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } } function checkMinFileSize(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { if (_ruleValue) { if (_currentElement[0].files.length && (_currentElement[0].files[0]['size'] / 1024) < _ruleValue) { addMessage(_currentForm, _ruleId, _rule, _ruleValue) } else if (rules[_currentForm][_ruleId]['maxFileSize']) { if (!_currentElement[0].files.length || ((_currentElement[0].files[0]['size'] / 1024) >= _ruleValue && (_currentElement[0].files[0]['size'] / 1024) <= rules[_currentForm][_ruleId]['maxFileSize'])) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } else { if (!_currentElement[0].files.length || (_currentElement[0].files[0]['size'] / 1024) >= _ruleValue) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } } } function checkMaxFileSize(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { if (_ruleValue) { if (_currentElement[0].files.length && (_currentElement[0].files[0]['size'] / 1024) > _ruleValue) { addMessage(_currentForm, _ruleId, _rule, _ruleValue) } else if (rules[_currentForm][_ruleId]['minFileSize']) { if (!_currentElement[0].files.length || ((_currentElement[0].files[0]['size'] / 1024) <= _ruleValue && (_currentElement[0].files[0]['size'] / 1024) >= rules[_currentForm][_ruleId]['minFileSize'])) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } else { if (!_currentElement[0].files.length || (_currentElement[0].files[0]['size'] / 1024) <= _ruleValue) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } } } function checkAllowedFileTypes(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { if (_ruleValue.length) { if (_currentElement[0].files.length && !_ruleValue.includes(_currentElement[0].files[0].name.split('.')[_currentElement[0].files[0].name.split('.').length - 1])) { addMessage(_currentForm, _ruleId, _rule, _ruleValue) } else if (!_currentElement[0].files.length || _ruleValue.includes(_currentElement[0].files[0].name.split('.')[_currentElement[0].files[0].name.split('.').length - 1])) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } } // ********* for Checkbox and Radio Button ************** function checkRadioRequired(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { let results = [] let _class = $(_currentElement).prop('class').split(' ')[0] $('.' + _class).each(function(i, ele) { results.push($(ele).prop('checked')) }) if (!results.some(function(_res) { return _res })) { // addmessage addCheckRadioMessages(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } else { removeCheckRadioMessages(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } function checkRadioMinRequired(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { let results = [] let _class = $(_currentElement).prop('class').split(' ')[0] $('.' + _class).each(function(i, ele) { results.push($(ele).prop('checked')) }) let totalCheckedItem = results.reduce(function(prev, cur) { if (cur) { prev += 1 return prev } return prev }, 0) if (_ruleValue) { if (totalCheckedItem && totalCheckedItem < _ruleValue) { addCheckRadioMessages(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } else if (rules[_currentForm][_ruleId]['maxRequired']) { if (!totalCheckedItem || (totalCheckedItem >= _ruleValue && totalCheckedItem <= rules[_currentForm][_ruleId]['maxRequired'])) { removeCheckRadioMessages(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } else { if (!totalCheckedItem || totalCheckedItem >= _ruleValue) { removeCheckRadioMessages(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } } } function checkRadioMaxRequired(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) { let results = [] let _class = $(_currentElement).prop('class').split(' ')[0] $('.' + _class).each(function(i, ele) { results.push($(ele).prop('checked')) }) let totalCheckedItem = results.reduce(function(prev, cur) { if (cur) { prev += 1 return prev } return prev }, 0) if (_ruleValue) { if (totalCheckedItem && totalCheckedItem > _ruleValue) { addCheckRadioMessages(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } else if (rules[_currentForm][_ruleId]['minRequired']) { if (!totalCheckedItem || (totalCheckedItem <= _ruleValue && totalCheckedItem >= rules[_currentForm][_ruleId]['minRequired'])) { removeCheckRadioMessages(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } else { if (!totalCheckedItem || totalCheckedItem <= _ruleValue) { removeCheckRadioMessages(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } } } // ********* end of Checkbox and Radio Button ************** // ********** For Custom Rules *************** function checkCustomFunction(_currentForm, _currentElement, _ruleId, _rule, _ruleValue, customFunction) { if (customFunction(_currentElement.val(), _currentElement)) { addMessage(_currentForm, _ruleId, _rule, _ruleValue) } else if (!customFunction(_currentElement.val(), _currentElement)) { removeMessage(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } // ********** end of Custom Rules *************** // ******************* End Of Checking Rules *************** // ****************** Triggering To Check The Rules *************** function checkRules(_currentForm, _currentElement, _ruleId, _ruleObj) { $.each(_ruleObj, function(_rule, _ruleValue) { if (_rule !== 'isDirted' && _rule !== 'isValid') { if (customRulesFunction[_rule]) { checkCustomFunction(_currentForm, _currentElement, _ruleId, _rule, _ruleValue, customRulesFunction[_rule]) } else if (defaultRulesFunction[_rule]) { defaultRulesFunction[_rule](_currentForm, _currentElement, _ruleId, _rule, _ruleValue) } } }) } function checkRadioRules(_currentForm, _currentElement, _ruleId, _ruleObj) { $.each(_ruleObj, function(_rule, _ruleValue) { if (_rule !== 'isDirted' && _rule !== 'isValid') { if (customRulesFunction[_rule]) { checkCustomFunction(_currentForm, _currentElement, _ruleId, _rule, _ruleValue, customRulesFunction[_rule]) } else { if (_ruleValue) { switch (_rule) { case 'required': checkRadioRequired(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) break; case "minRequired": checkRadioMinRequired(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) break; case "maxRequired": checkRadioMaxRequired(_currentForm, _currentElement, _ruleId, _rule, _ruleValue) break; default: console.log('no radio matches found'); break; } } } } }) } // ****************** End Of Triggering *************** // ******************** Adding The Events To The Elements *************** function addRulesEvents(_currentForm, _rules) { $.each(_rules, function(_ruleId, _ruleObj) { if ($('#' + _ruleId).length) { let _currentElement = $('#' + _ruleId) _currentElement.on('blur', function() { if (!rules[_currentForm][_ruleId]['isDirted'] && _currentElement.val() !== '' && _currentElement.val() !== null) { rules[_currentForm][_ruleId]['isDirted'] = true } if (_currentElement.val() !== '' && _currentElement.val() !== null) { checkRules(_currentForm, _currentElement, _ruleId, _ruleObj) } }) _currentElement.on('keyup', function(e) { if (rules[_currentForm][_ruleId]['isDirted'] && !excludedKeys.includes(e.keyCode)) { checkRules(_currentForm, _currentElement, _ruleId, _ruleObj) } }) let element = document.querySelector('#' + _currentElement.attr('id')) if (element.tagName == 'SELECT' || element.type == 'file') { _currentElement.on('change', function(e) { if (rules[_currentForm][_ruleId]['isDirted'] && !excludedKeys.includes(e.keyCode)) { checkRules(_currentForm, _currentElement, _ruleId, _ruleObj) } }) } } else { let _elements = $('.' + _ruleId) _elements.each(function(i, _currentElement) { $(_currentElement).on('blur', function() { if (!rules[_currentForm][_ruleId]['isDirted'] && $(_currentElement).prop('checked')) { rules[_currentForm][_ruleId]['isDirted'] = true } if ($(_currentElement).prop('checked')) { checkRadioRules(_currentForm, _currentElement, _ruleId, _ruleObj) } }) $(_currentElement).on('change', function(e) { if (rules[_currentForm][_ruleId]['isDirted'] && !excludedKeys.includes(e.keyCode)) { checkRadioRules(_currentForm, _currentElement, _ruleId, _ruleObj) } }) }) } }) } // **************** End Of Adding The Events **************** // ********* Dynamically Add And Remove Rules *************** function addRule(_currentForm, _ruleObj, id) { let _ruleId = id let _obj = {} organiseRules(_currentForm, _ruleId, _ruleObj) _obj[_ruleId] = _ruleObj addRulesEvents(_currentForm, _obj) } function removeRule(_currentForm, id) { let _ruleId = id if (rules[_currentForm][_ruleId]) { delete rules[_currentForm][_ruleId] } if (messages[_currentForm][_ruleId]) { delete messages[_currentForm][_ruleId] } $('#' + _ruleId).off('blur') $('#' + _ruleId).off('keyup') } // **********End Of Add and Remove Rules *************** // ********* Organise Rules ******** function organiseRules(_currentForm, ruleId, ruleValue) { if (typeof ruleValue == 'string') { if (!rules[_currentForm]) rules[_currentForm] = {}; rules[_currentForm][ruleId] = {} rules[_currentForm][ruleId][ruleValue] = true rules[_currentForm][ruleId]['isDirted'] = false rules[_currentForm][ruleId]['isValid'] = false } else { if (Object.keys(ruleValue).includes('messages')) { $.each(ruleValue.messages, function(_rule, _ruleValue) { if (!messages[_currentForm]) messages[_currentForm] = {}; if (messages[_currentForm][ruleId]) { messages[_currentForm][ruleId][_rule] = _ruleValue } else { messages[_currentForm][ruleId] = {} messages[_currentForm][ruleId][_rule] = _ruleValue } }) delete ruleValue.messages } if (!rules[_currentForm]) rules[_currentForm] = {}; if (rules[_currentForm][ruleId]) { rules[_currentForm][ruleId] = {...rules[_currentForm][ruleId], ...ruleValue, isDirted: false, isValid: false } } else { rules[_currentForm][ruleId] = {...ruleValue, isDirted: false, isValid: false } } } } // ********* End ************ // *********** Checking the form is Valid or Not while Submitting ************ function isRequiredValid(_currentForm) { let isFocusSetted = false let reqId = [] $.each(rules[_currentForm], function(_ruleId, _ruleObj) { if ($('#' + _ruleId).length) { let _currentElement = $('#' + _ruleId) if (_ruleObj.required) { reqId.push(_ruleId) if (_currentElement.val() == '' || _currentElement.val() == null) { rules[_currentForm][_ruleId]['isDirted'] = true rules[_currentForm][_ruleId]['isValid'] = false if (!isFocusSetted) { isFocusSetted = true $('#' + _ruleId).focus() } addMessage(_currentForm, _ruleId, 'required', _ruleObj.required) } else if (_currentElement.val() !== '' || _currentElement.val() !== null) { let _nextElement = document.querySelector('#' + _ruleId) if (_nextElement.nextElementSibling) { _nextElement = _nextElement.nextElementSibling if (!_nextElement.classList.contains('error')) { rules[_currentForm][_ruleId]['isValid'] = true } else { if (!isFocusSetted) { isFocusSetted = true $('#' + _ruleId).focus() } } } else { if (!_nextElement.classList.contains('error')) { rules[_currentForm][_ruleId]['isValid'] = true } else { if (!isFocusSetted) { isFocusSetted = true $('#' + _ruleId).focus() } } } removeMessage(_currentForm, _currentElement, _ruleId, 'required', _ruleObj.required) } } } else { let _currentElement = $('.' + _ruleId) if (_ruleObj.required) { console.log(_ruleId); reqId.push(_ruleId) rules[_currentForm][_ruleId]['isDirted'] = true checkRadioRequired(_currentForm, _currentElement[0], _ruleId, 'required', _ruleObj.required) } } }) return reqId.every(function(id) { return rules[_currentForm][id]['isValid'] }) } function isFieldsValid(_currentForm) { console.log('isValid checking'); let isFocusSetted = false return Object.keys(rules[_currentForm]).every(function(id) { if (rules[_currentForm][id]['isValid']) { return true } if ($('#' + id).length) { if (!$('#' + id).val()) { return true } else { if (!isFocusSetted) { isFocusSetted = true $('#' + id).focus() } return false } } else { let results = [] $('.' + id).each(function(i, ele) { results.push($(ele).prop('checked')) }) if (!results.some(function(_res) { return _res })) { return true } else { if (!isFocusSetted) { isFocusSetted = true $('#' + id).focus() } return false } } }) } // ******************* End ************************* // **************** Starting Point Of Execution *************** // variable initialization let rules = {} let defaultMessages = { required: "This field is required.", email: "Please enter a valid email address.", url: "Please enter a valid URL.", date: "Please enter a valid date.", digits: "Please enter only digits.", maxlength: "Please enter no more than 0 characters.", minlength: "Please enter at least 0 characters.", maxFileSize: "Please Select file not more than 0 KB.", minFileSize: "Please Select file at least with 0 KB.", allowedTypes: "Please Select file format as 0 .", minRequired: "Please Select at least 0 options.", maxRequired: "Please Select Max of 0 options.", } let messages = {} let excludedKeys = [ 16, 17, 18, 20, 35, 36, 37, 38, 39, 40, 45, 144, 225, 91 ]; defaultRulesFunction = { required: checkRequired, maxlength: checkMaxLength, minlength: checkMinLength, digits: checkDigits, email: checkEmail, url: checkURL, date: checkDate, minFileSize: checkMinFileSize, maxFileSize: checkMaxFileSize, allowedTypes: checkAllowedFileTypes, } customRulesFunction = {} $.fn.zvalidate = function(_validateObj = {}) { let _currentForm = this.attr('id') if (!rules[_currentForm]) rules[_currentForm] = {}; messages[_currentForm] = {} messages[_currentForm] = _validateObj.messages || {} // converting the string rule to obj if (!$.isEmptyObject(_validateObj)) { if (!$.isEmptyObject(_validateObj.rules)) { $.each(_validateObj.rules, function(ruleId, ruleValue) { organiseRules(_currentForm, ruleId, ruleValue) }) addRulesEvents(_currentForm, rules[_currentForm]) } if (_validateObj.submitHandler) { let formId = this.attr('id') let form = this $('#' + formId).on('submit', function(e) { e.preventDefault(); if (isRequiredValid(_currentForm) && isFieldsValid(_currentForm)) { _validateObj.submitHandler(form) } else { console.log('There is error in form'); } }) } } console.log(rules, messages); } $.fn.zrules = function(action, _ruleObj = {}) { let _currentForm = this.closest('form').attr('id') let id = '' if (this[0].type == 'checkbox' || this[0].type == 'radio') { id = this[0].classList[0] } else { id = this.attr('id') } if (action == 'add') { addRule.call(this, _currentForm, _ruleObj, id) } if (action == 'remove') { removeRule.call(this, _currentForm, id) } } $.zaddMethod = function(_ruleName, _ruleFunc, _ruleErrorStat) { customRulesFunction[_ruleName] = _ruleFunc defaultMessages[_ruleName] = _ruleErrorStat } })(jQuery) // **************** Example **************** // use Field id to add the rule except checkbox and radio button // use Field class to add the rules to checkbox and radio button // $(document).ready(function(){ // $("#registration").zvalidate({ // // Specify validation rules // rules: { // firstname: "required", // lastname: { // required : true, // minlength : 5, // maxlength : 10, // messages :{ // required : 'Please enter last name', // } // }, // date :{ // required : true, // date : true, // messages : { // required : "Please Enter First Name" // } // }, // email :{ // required : true, // email : true, // }, // socialMediaUrl :{ // url : true // }, // myfile :{ // required : true, // minFileSize : 3, // maxFileSize : 20, // allowedTypes : ['js','html','pdf'] // }, // 'fav-language':{ // required : true, // minRequired : 2, // maxRequired :2, // messages:{ // // Message can be function too // required : () =>{ // return "This field is required" // } // } // }, // phone: { // required: true, // digits: true, // minlength: 10, // maxlength: 10 // }, // } // , // submitHandler : function (form) { // console.log('formSubmitted', form); // }, // messages: { // firstname: { // required: "Please enter first name", // }, // lastname: { // required: "Please enter last name", // minlength: "Password field except atleast 5 digits", // maxlength: "Password field accepts Maximum of 10 digits", // }, // date :{ // date: "Please enter a valid date.", // }, // email: { // required: "Please enter email address", // email: "Please enter a valid email address.", // }, // socialMediaUrl : { // url : "please Enter valid url" // }, // // I didn't provide any message for myFiles and fav-language field, so it takes the default messages. // phone: { // required: "Please enter phone number", // digits: "Please enter valid phone number", // minlength: "Phone number field accept only 10 digits", // maxlength: "Phone number field accept only 10 digits", // }, // }, // }); // // custom conditions // var bannedEmails = ["test@gmail.com", "sample@gmail.com"]; // $.zaddMethod( // //Rule NAme // "emailNotBanned", // // Rule Func // function (b,a) { // // if it return true => adds msg to the screen, if it returns false ==> removes the msg // return bannedEmails.indexOf(b) < 0; // }, // // Error Msg // "This email address is banned." // ); // // dynamically adding rules // $('#email').zrules('add',{ // emailNotBanned : true // }) // // dynamically adding rules // $("#phone").zrules('remove') // }); ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// customvar.nonlogged = function() { customvar.dynamicLinks({ "href": { ".zgh-login": 'https://accounts.' + Zdomain + '.' + domainOne + '/signin?' + customvar.clang + 'servicename=VirtualOffice&signupurl=https://www.' + Zdomain + '.' + domainOne + langsrc + 'workplace/pricing.html&serviceurl=https://workplace.zoho.' + dcdomainOne, ".zgh-signup": langsrc + 'workplace/pricing.html', } }) } customvar.logged = function() { customvar.dynamicLinks({ "href": { ".act-btn.cta-btn": 'https://workplace.' + Zdomain + '.' + dcdomainOne + '', }, "html": { ".act-btn.cta-btn": Drupal.t('Access Zoho') + ' Workplace', }, }) } customvar.supportId = function() { if (currentUrlLang === 'jp') { return 'sales@zoho.jp'; } else { return 'support@zohoworkplace.com'; } } var workCustCount = 16; $(document).ready(function() { var promoSection = '
' + Drupal.t('or sign in using ') + 'GoogleFacebookTwitterLinkedin