Plugin LiveValidation.js
I.Nhiệm vụ LiveValidation.js
- Là 1 plugin jQuery giúp chúng ta kiểm tra các giá trị nhập vào 1 cách nhanh chóng và dễ dàng
II.Cách Download và vị trí trong WAK
1.Download
- Bạn có thể download và xem các hướng dẫn cơ bản tại trang chủ của đơn vị làm ra plugin này : https://jqueryvalidation.org/
2.Vị trí trong file WAK
- Vị trí :\web\js\livevalidation.js
III.Source Code
// Đây là source code của plugin này,Hãy đọc nếu bạn muốn tìm hiểu rõ hơn//
var LiveValidation = function(e, i) { this.initialize(e, i) }; LiveValidation.VERSION = "1.3 standalone", LiveValidation.TEXTAREA = 1, LiveValidation.TEXT = 2, LiveValidation.PASSWORD = 3, LiveValidation.CHECKBOX = 4, LiveValidation.SELECT = 5, LiveValidation.FILE = 6, LiveValidation.DIV = 7, LiveValidation.HIDDEN = 8, LiveValidation.massValidate = function(e) { for (var i = null, t = !0, a = 0, n = e.length; n > a; ++a) if (get_top_level_node(e[a].element) == document) { var l = e[a].validate(); l || null != i || (i = e[a]), t && (t = l) } if (null != i) { var s = i.element; null != s.id && null != window.activateTabContainedElement && window.activateTabContainedElement(s.id), scroll_to(s), null != s.focus && s.focus() } return t }, LiveValidation.prototype = { validClass: "LV_valid", invalidClass: "LV_invalid", messageClass: "LV_validation_message", validFieldClass: "LV_valid_field", invalidFieldClass: "LV_invalid_field", initialize: function(e, i) { var t = this; if (!e) throw new Error("LiveValidation::initialize - No element reference or element id has been provided!"); if (this.element = e.nodeName ? e : document.getElementById(e), !this.element) throw new Error("LiveValidation::initialize - No element with reference or id of '" + e + "' exists!"); if (this.validations = [], this.elementType = this.getElementType(), this.form = this.element.form, !this.form) for (var a = this.element.parentNode; a;) "FORM" == a.nodeName.toUpperCase() && (this.form = a), a = a.parentNode; var n = i || {}; this.validMessage = n.validMessage || "Thankyou!"; var a = n.insertAfterWhatNode || this.element; if (this.insertAfterWhatNode = a.nodeType ? a : document.getElementById(a), this.onValid = n.onValid || function() { this.insertMessage(this.createMessageSpan()), this.addFieldClass() }, this.onInvalid = n.onInvalid || function() { this.insertMessage(this.createMessageSpan()), this.addFieldClass() }, this.onlyOnBlur = n.onlyOnBlur || !1, this.wait = n.wait || 0, this.onlyOnSubmit = n.onlyOnSubmit || !1, this.form && (this.formObj = LiveValidationForm.getInstance(this.form), this.formObj.addField(this)), this.oldOnBlur = this.element.onblur || function() {}, this.oldOnClick = this.element.onclick || function() {}, this.oldOnChange = this.element.onchange || function() {}, this.oldOnKeyup = this.element.onkeyup || function() {}, !this.onlyOnSubmit) switch (this.elementType) { case LiveValidation.CHECKBOX: this.element.onclick = function(e) { return t.validate(), t.oldOnClick.call(this, e) }; case LiveValidation.DIV: case LiveValidation.FILE: this.element.onchange = function(e) { return t.validate(), t.oldOnChange.call(this, e) }; break; case LiveValidation.SELECT: this.element.onchange = function(e) { return t.validate(), t.oldOnChange.call(this, e) }; default: this.element.onblur = function(e) { return t.doOnBlur(e), t.oldOnBlur.call(this, e) } } }, destroy: function() { if (this.formObj && (this.formObj.removeField(this), this.formObj.destroy()), !this.onlyOnSubmit) switch (this.elementType) { case LiveValidation.CHECKBOX: this.element.onclick = this.oldOnClick; case LiveValidation.DIV: case LiveValidation.FILE: this.element.onchange = this.oldOnChange; break; case LiveValidation.SELECT: this.element.onchange = this.oldOnChange; default: this.element.onblur = this.oldOnBlur } this.validations = [], this.removeMessageAndFieldClass() }, add: function(e, i) { return this.validations.push({ type: e, params: i || {} }), this }, remove: function(e, i) { for (var t = !1, a = 0, n = this.validations.length; n > a; a++) if (this.validations[a].type == e && this.validations[a].params == i) { t = !0; break } return t && this.validations.splice(a, 1), this }, doOnBlur: function(e) { this.validate(e) }, getElementType: function() { switch (!0) { case "TEXTAREA" == this.element.nodeName.toUpperCase(): return LiveValidation.TEXTAREA; case "INPUT" == this.element.nodeName.toUpperCase() && "TEXT" == this.element.type.toUpperCase(): return LiveValidation.TEXT; case "INPUT" == this.element.nodeName.toUpperCase() && "HIDDEN" == this.element.type.toUpperCase(): return LiveValidation.HIDDEN; case "INPUT" == this.element.nodeName.toUpperCase() && "PASSWORD" == this.element.type.toUpperCase(): return LiveValidation.PASSWORD; case "INPUT" == this.element.nodeName.toUpperCase() && "CHECKBOX" == this.element.type.toUpperCase(): return LiveValidation.CHECKBOX; case "INPUT" == this.element.nodeName.toUpperCase() && "FILE" == this.element.type.toUpperCase(): return LiveValidation.FILE; case "SELECT" == this.element.nodeName.toUpperCase(): return LiveValidation.SELECT; case "DIV" == this.element.nodeName.toUpperCase(): return LiveValidation.DIV; case "TD" == this.element.nodeName.toUpperCase(): return LiveValidation.DIV; default: throw new Error("LiveValidation::getElementType - Element must be an input, select, or textarea!") } }, doValidations: function() { this.validationFailed = !1; for (var e = 0, i = this.validations.length; i > e; ++e) { var t = this.validations[e]; switch (t.type) { case Validate.Presence: case Validate.Confirmation: case Validate.Acceptance: this.displayMessageWhenEmpty = !0, this.validationFailed = !this.validateElement(t.type, t.params); break; default: this.validationFailed = !this.validateElement(t.type, t.params) } if (this.validationFailed) return !1 } return this.message = this.validMessage, !0 }, validateElement: function(e, i) { var t = this.elementType == LiveValidation.DIV ? this.element.innerText || this.element.textContent : this.elementType == LiveValidation.SELECT ? this.element.selectedIndex < 0 ? null : this.element.options[this.element.selectedIndex].value : this.element.value; if (e == Validate.Acceptance) { if (this.elementType != LiveValidation.CHECKBOX) throw new Error("LiveValidation::validateElement - Element to validate acceptance must be a checkbox!"); t = this.element.checked } var a = !0; try { e(t, i) } catch (n) { if (!(n instanceof Validate.Error)) throw n; ("" !== t || "" === t && this.displayMessageWhenEmpty) && (this.validationFailed = !0, this.message = n.message, a = !1) } finally { return a } }, validate: function() { if (this.element.disabled) return !0; var e = this.doValidations(); return e ? (this.onValid(), !0) : (this.onInvalid(), !1) }, enable: function() { return this.element.disabled = !1, this }, disable: function() { return this.element.disabled = !0, this.removeMessageAndFieldClass(), this }, createMessageSpan: function() { var e = document.createElement("div"), i = document.createElement("span"), t = document.createTextNode(this.message); return i.appendChild(t), e.appendChild(i), e }, insertMessage: function(e) { if (this.removeMessage(), this.displayMessageWhenEmpty && (this.elementType == LiveValidation.CHECKBOX || "" == this.element.value) || "" != this.element.value) { var i = this.validationFailed ? this.invalidClass : this.validClass; e.className += " " + this.messageClass + " " + i, this.insertAfterWhatNode.nextSibling ? this.insertAfterWhatNode.parentNode.insertBefore(e, this.insertAfterWhatNode.nextSibling) : this.insertAfterWhatNode.parentNode.appendChild(e); var t = this; setTimeout(function() { t.removeMessage() }, 2e3) } }, addFieldClass: function() { this.removeFieldClass(), this.validationFailed ? -1 == this.element.className.indexOf(this.invalidFieldClass) && (this.element.className += " " + this.invalidFieldClass) : (this.displayMessageWhenEmpty || "" != this.element.value) && -1 == this.element.className.indexOf(this.validFieldClass) && (this.element.className += " " + this.validFieldClass) }, removeMessage: function() { for (var e, i = this.insertAfterWhatNode; i.nextSibling;) { if (1 === i.nextSibling.nodeType) { e = i.nextSibling; break } i = i.nextSibling } e && -1 != e.className.indexOf(this.messageClass) && this.insertAfterWhatNode.parentNode.removeChild(e) }, removeFieldClass: function() { -1 != this.element.className.indexOf(this.invalidFieldClass) && (this.element.className = this.element.className.split(this.invalidFieldClass).join("")), -1 != this.element.className.indexOf(this.validFieldClass) && (this.element.className = this.element.className.split(this.validFieldClass).join(" ")) }, removeMessageAndFieldClass: function() { this.removeMessage(), this.removeFieldClass() } }; var LiveValidationForm = function(e) { this.initialize(e) }; LiveValidationForm.instances = {}, LiveValidationForm.getInstance = function(e) { var i = Math.random() * Math.random(); return e.id || (e.id = "formId_" + i.toString().replace(/\./, "") + (new Date).valueOf()), LiveValidationForm.instances[e.id] || (LiveValidationForm.instances[e.id] = new LiveValidationForm(e)), LiveValidationForm.instances[e.id] }, LiveValidationForm.prototype = { initialize: function(e) { this.name = e.id, this.element = e, this.fields = [], this.oldOnSubmit = this.element.onsubmit || function() {}; var i = this; this.element.onsubmit = function(e) { return LiveValidation.massValidate(i.fields) ? i.oldOnSubmit.call(this, e || window.event) !== !1 : !1 } }, addField: function(e) { this.fields.push(e) }, removeField: function(e) { for (var i = [], t = 0, a = this.fields.length; a > t; t++) this.fields[t] !== e && i.push(this.fields[t]); this.fields = i }, destroy: function(e) { return 0 == this.fields.length || e ? (this.element.onsubmit = this.oldOnSubmit, LiveValidationForm.instances[this.name] = null, !0) : !1 } }; var Validate = { Presence: function(e, i) { var i = i || {}, t = i.failureMessage || "Can't be empty!"; return e = trim(e), ("" === e || null === e || void 0 === e) && Validate.fail(t), !0 }, Numericality: function(e, i) { var i = i || {}, t = i.replRegex ? i.replRegex : null, a = i.replValue ? i.replValue : null, n = i.notANumberMessage || "Must be a number!", l = i.notAnIntegerMessage || "Must be an integer!"; e = e.replace(/,/g, ""), null != t && (e.match(t) || Validate.fail(n), e = e.replace(t, a)); var s = e, e = Number(e), o = i.minimum || 0 == i.minimum ? i.minimum : null, r = i.maximum || 0 == i.maximum ? i.maximum : null, d = null, m = null; i.gtoeqElement && (m = i.gtoeqElement.value, null != t && (m.match(t) ? (d = i.gtoeqElement, m = Number(m.replace(t, a)), (null == o || o > m) && (o = m)) : m = null)); var h = null, u = null; i.ltoeqElement && (u = i.ltoeqElement.value, null != t && (u.match(t) ? (h = i.ltoeqElement, u = Number(u.replace(t, a)), (null == r || u > r) && (r = u)) : u = null)); var c = i.is || 0 == i.is ? i.is : null; null != c && null != c.value && (c = c.value), null != o && null != o.value && (o = o.value), null != r && null != r.value && (r = r.value); var v = i.tooLowMessage || "Must not be less than " + o + "!"; v = v.replace("$minimum$", o); var f = i.tooHighMessage || "Must not be more than " + r + "!"; f = f.replace("$maximum$", r); var p = i.wrongNumberMessage || "Must be " + c + "!"; return p = p.replace("$is$", c), isFinite(e) || Validate.fail(n), i.onlyInteger && (/\.0+$|\.$/.test(String(s)) || e != parseInt(e)) && Validate.fail(l), null != c && e != Number(c) ? Validate.fail(p) : null !== o && e < Number(o) ? Validate.fail(v) : null !== r && e > Number(r) && Validate.fail(f), !0 }, Format: function(e, i) { var e = String(e), i = i || {}, t = i.failureMessage || "Not valid!", a = i.pattern || /./, n = i.negate || !1; return n || a.test(e) || Validate.fail(t), n && a.test(e) && Validate.fail(t), !0 }, Email: function(e, i) { var i = i || {}, t = i.failureMessage || "Must be a valid email address!"; return Validate.Format(e, { failureMessage: t, pattern: /^([^@\s]+)@((?:[-a-z0-9]+\.)+[a-z]{2,})$/i }), !0 }, Length: function(e, i) { var e = String(e), i = i || {}, t = i.minimum || 0 == i.minimum ? i.minimum : null, a = i.maximum || 0 == i.maximum ? i.maximum : null, n = i.is || 0 == i.is ? i.is : null, l = i.wrongLengthMessage || "Must be " + n + " characters long!"; l = l.replace("$is$", n); var s = i.tooShortMessage || "Must not be less than " + t + " characters long!"; s = s.replace("$minimum$", t); var o = i.tooLongMessage || "Must not be more than " + a + " characters long!"; switch (o = o.replace("$maximum$", a), !0) { case null !== n: e.length != Number(n) && Validate.fail(l); break; case null !== t && null !== a: Validate.Length(e, { tooShortMessage: s, minimum: t }), Validate.Length(e, { tooLongMessage: o, maximum: a }); break; case null !== t: e.length < Number(t) && Validate.fail(s); break; case null !== a: e.length > Number(a) && Validate.fail(o); break; default: throw new Error("Validate::Length - Length(s) to validate against must be provided!") } return !0 }, Inclusion: function(e, i) { var i = i || {}, t = i.failureMessage || "Must be included in the list!", a = i.caseSensitive === !1 ? !1 : !0; if (i.allowNull && null == e) return !0; i.allowNull || null != e || Validate.fail(t); var n = i.within || []; if (!a) { for (var l = [], s = 0, o = n.length; o > s; ++s) { var r = n[s]; "string" == typeof r && (r = r.toLowerCase()), l.push(r) } n = l, "string" == typeof e && (e = e.toLowerCase()) } for (var d = !1, m = 0, o = n.length; o > m; ++m) n[m] == e && (d = !0), i.partialMatch && -1 != e.indexOf(n[m]) && (d = !0); return (!i.negate && !d || i.negate && d) && Validate.fail(t), !0 }, Exclusion: function(e, i) { var i = i || {}; return i.failureMessage = i.failureMessage || "Must not be included in the list!", i.negate = !0, Validate.Inclusion(e, i), !0 }, Confirmation: function(e, i) { if (!i.match) throw new Error("Validate::Confirmation - Error validating confirmation: Id of element to match must be provided!"); var i = i || {}, t = i.failureMessage || "Does not match!", a = i.match.nodeName ? i.match : document.getElementById(i.match); if (!a) throw new Error("Validate::Confirmation - There is no reference with name of, or element with id of '" + i.match + "'!"); return e != a.value && Validate.fail(t), !0 }, Acceptance: function(e, i) { var i = i || {}, t = i.failureMessage || "Must be accepted!"; return e || Validate.fail(t), !0 }, Custom: function(e, i) { var i = i || {}, t = i.against || function() { return !0 }, a = i.args || {}, n = i.failureMessage || "Not valid!"; return t(e, a) || Validate.fail(n), !0 }, now: function(e, i, t) { if (!e) throw new Error("Validate::now - Validation function must be provided!"); var a = !0; try { e(i, t || {}) } catch (n) { if (!(n instanceof Validate.Error)) throw n; a = !1 } finally { return a } }, fail: function(e) { throw new Validate.Error(e) }, Error: function(e) { this.message = e, this.name = "ValidationError" } };