").attr("name",c.submitButton.name).val(a(c.submitButton).val()).appendTo(c.currentForm)),!c.settings.submitHandler||(e=c.settings.submitHandler.call(c,c.currentForm,b),d&&d.remove(),void 0!==e&&e)}return c.settings.debug&&b.preventDefault(),c.cancelSubmit?(c.cancelSubmit=!1,d()):c.form()?c.pendingRequest?(c.formSubmitted=!0,!1):d():(c.focusInvalid(),!1)})),c)},valid:function(){var b,c,d;return a(this[0]).is("form")?b=this.validate().form():(d=[],b=!0,c=a(this[0].form).validate(),this.each(function(){b=c.element(this)&&b,b||(d=d.concat(c.errorList))}),c.errorList=d),b},rules:function(b,c){var d,e,f,g,h,i,j=this[0];if(null!=j&&(!j.form&&j.hasAttribute("contenteditable")&&(j.form=this.closest("form")[0],j.name=this.attr("name")),null!=j.form)){if(b)switch(d=a.data(j.form,"validator").settings,e=d.rules,f=a.validator.staticRules(j),b){case"add":a.extend(f,a.validator.normalizeRule(c)),delete f.messages,e[j.name]=f,c.messages&&(d.messages[j.name]=a.extend(d.messages[j.name],c.messages));break;case"remove":return c?(i={},a.each(c.split(/\s/),function(a,b){i[b]=f[b],delete f[b]}),i):(delete e[j.name],f)}return g=a.validator.normalizeRules(a.extend({},a.validator.classRules(j),a.validator.attributeRules(j),a.validator.dataRules(j),a.validator.staticRules(j)),j),g.required&&(h=g.required,delete g.required,g=a.extend({required:h},g)),g.remote&&(h=g.remote,delete g.remote,g=a.extend(g,{remote:h})),g}}}),a.extend(a.expr.pseudos||a.expr[":"],{blank:function(b){return!a.trim(""+a(b).val())},filled:function(b){var c=a(b).val();return null!==c&&!!a.trim(""+c)},unchecked:function(b){return!a(b).prop("checked")}}),a.validator=function(b,c){this.settings=a.extend(!0,{},a.validator.defaults,b),this.currentForm=c,this.init()},a.validator.format=function(b,c){return 1===arguments.length?function(){var c=a.makeArray(arguments);return c.unshift(b),a.validator.format.apply(this,c)}:void 0===c?b:(arguments.length>2&&c.constructor!==Array&&(c=a.makeArray(arguments).slice(1)),c.constructor!==Array&&(c=[c]),a.each(c,function(a,c){b=b.replace(new RegExp("\\{"+a+"\\}","g"),function(){return c})}),b)},a.extend(a.validator,{defaults:{messages:{},groups:{},rules:{},errorClass:"error",pendingClass:"pending",validClass:"valid",errorElement:"label",focusCleanup:!1,focusInvalid:!0,errorContainer:a([]),errorLabelContainer:a([]),onsubmit:!0,ignore:":hidden",ignoreTitle:!1,onfocusin:function(a){this.lastActive=a,this.settings.focusCleanup&&(this.settings.unhighlight&&this.settings.unhighlight.call(this,a,this.settings.errorClass,this.settings.validClass),this.hideThese(this.errorsFor(a)))},onfocusout:function(a){this.checkable(a)||!(a.name in this.submitted)&&this.optional(a)||this.element(a)},onkeyup:function(b,c){var d=[16,17,18,20,35,36,37,38,39,40,45,144,225];9===c.which&&""===this.elementValue(b)||a.inArray(c.keyCode,d)!==-1||(b.name in this.submitted||b.name in this.invalid)&&this.element(b)},onclick:function(a){a.name in this.submitted?this.element(a):a.parentNode.name in this.submitted&&this.element(a.parentNode)},highlight:function(b,c,d){"radio"===b.type?this.findByName(b.name).addClass(c).removeClass(d):a(b).addClass(c).removeClass(d)},unhighlight:function(b,c,d){"radio"===b.type?this.findByName(b.name).removeClass(c).addClass(d):a(b).removeClass(c).addClass(d)}},setDefaults:function(b){a.extend(a.validator.defaults,b)},messages:{required:"This field is required.",remote:"Please fix this field.",email:"Please enter a valid email address.",url:"Please enter a valid URL.",date:"Please enter a valid date.",dateISO:"Please enter a valid date (ISO).",number:"Please enter a valid number.",digits:"Please enter only digits.",equalTo:"Please enter the same value again.",maxlength:a.validator.format("Please enter no more than {0} characters."),minlength:a.validator.format("Please enter at least {0} characters."),rangelength:a.validator.format("Please enter a value between {0} and {1} characters long."),range:a.validator.format("Please enter a value between {0} and {1}."),max:a.validator.format("Please enter a value less than or equal to {0}."),min:a.validator.format("Please enter a value greater than or equal to {0}."),step:a.validator.format("Please enter a multiple of {0}.")},autoCreateRanges:!1,prototype:{init:function(){function b(b){!this.form&&this.hasAttribute("contenteditable")&&(this.form=a(this).closest("form")[0],this.name=a(this).attr("name"));var c=a.data(this.form,"validator"),d="on"+b.type.replace(/^validate/,""),e=c.settings;e[d]&&!a(this).is(e.ignore)&&e[d].call(c,this,b)}this.labelContainer=a(this.settings.errorLabelContainer),this.errorContext=this.labelContainer.length&&this.labelContainer||a(this.currentForm),this.containers=a(this.settings.errorContainer).add(this.settings.errorLabelContainer),this.submitted={},this.valueCache={},this.pendingRequest=0,this.pending={},this.invalid={},this.reset();var c,d=this.groups={};a.each(this.settings.groups,function(b,c){"string"==typeof c&&(c=c.split(/\s/)),a.each(c,function(a,c){d[c]=b})}),c=this.settings.rules,a.each(c,function(b,d){c[b]=a.validator.normalizeRule(d)}),a(this.currentForm).on("focusin.validate focusout.validate keyup.validate",":text, [type='password'], [type='file'], select, textarea, [type='number'], [type='search'], [type='tel'], [type='url'], [type='email'], [type='datetime'], [type='date'], [type='month'], [type='week'], [type='time'], [type='datetime-local'], [type='range'], [type='color'], [type='radio'], [type='checkbox'], [contenteditable], [type='button']",b).on("click.validate","select, option, [type='radio'], [type='checkbox']",b),this.settings.invalidHandler&&a(this.currentForm).on("invalid-form.validate",this.settings.invalidHandler)},form:function(){return this.checkForm(),a.extend(this.submitted,this.errorMap),this.invalid=a.extend({},this.errorMap),this.valid()||a(this.currentForm).triggerHandler("invalid-form",[this]),this.showErrors(),this.valid()},checkForm:function(){this.prepareForm();for(var a=0,b=this.currentElements=this.elements();b[a];a++)this.check(b[a]);return this.valid()},element:function(b){var c,d,e=this.clean(b),f=this.validationTargetFor(e),g=this,h=!0;return void 0===f?delete this.invalid[e.name]:(this.prepareElement(f),this.currentElements=a(f),d=this.groups[f.name],d&&a.each(this.groups,function(a,b){b===d&&a!==f.name&&(e=g.validationTargetFor(g.clean(g.findByName(a))),e&&e.name in g.invalid&&(g.currentElements.push(e),h=g.check(e)&&h))}),c=this.check(f)!==!1,h=h&&c,c?this.invalid[f.name]=!1:this.invalid[f.name]=!0,this.numberOfInvalids()||(this.toHide=this.toHide.add(this.containers)),this.showErrors(),a(b).attr("aria-invalid",!c)),h},showErrors:function(b){if(b){var c=this;a.extend(this.errorMap,b),this.errorList=a.map(this.errorMap,function(a,b){return{message:a,element:c.findByName(b)[0]}}),this.successList=a.grep(this.successList,function(a){return!(a.name in b)})}this.settings.showErrors?this.settings.showErrors.call(this,this.errorMap,this.errorList):this.defaultShowErrors()},resetForm:function(){a.fn.resetForm&&a(this.currentForm).resetForm(),this.invalid={},this.submitted={},this.prepareForm(),this.hideErrors();var b=this.elements().removeData("previousValue").removeAttr("aria-invalid");this.resetElements(b)},resetElements:function(a){var b;if(this.settings.unhighlight)for(b=0;a[b];b++)this.settings.unhighlight.call(this,a[b],this.settings.errorClass,""),this.findByName(a[b].name).removeClass(this.settings.validClass);else a.removeClass(this.settings.errorClass).removeClass(this.settings.validClass)},numberOfInvalids:function(){return this.objectLength(this.invalid)},objectLength:function(a){var b,c=0;for(b in a)void 0!==a[b]&&null!==a[b]&&a[b]!==!1&&c++;return c},hideErrors:function(){this.hideThese(this.toHide)},hideThese:function(a){a.not(this.containers).text(""),this.addWrapper(a).hide()},valid:function(){return 0===this.size()},size:function(){return this.errorList.length},focusInvalid:function(){if(this.settings.focusInvalid)try{a(this.findLastActive()||this.errorList.length&&this.errorList[0].element||[]).filter(":visible").focus().trigger("focusin")}catch(b){}},findLastActive:function(){var b=this.lastActive;return b&&1===a.grep(this.errorList,function(a){return a.element.name===b.name}).length&&b},elements:function(){var b=this,c={};return a(this.currentForm).find("input, select, textarea, [contenteditable]").not(":submit, :reset, :image, :disabled").not(this.settings.ignore).filter(function(){var d=this.name||a(this).attr("name");return!d&&b.settings.debug&&window.console&&console.error("%o has no name assigned",this),this.hasAttribute("contenteditable")&&(this.form=a(this).closest("form")[0],this.name=d),!(d in c||!b.objectLength(a(this).rules()))&&(c[d]=!0,!0)})},clean:function(b){return a(b)[0]},errors:function(){var b=this.settings.errorClass.split(" ").join(".");return a(this.settings.errorElement+"."+b,this.errorContext)},resetInternals:function(){this.successList=[],this.errorList=[],this.errorMap={},this.toShow=a([]),this.toHide=a([])},reset:function(){this.resetInternals(),this.currentElements=a([])},prepareForm:function(){this.reset(),this.toHide=this.errors().add(this.containers)},prepareElement:function(a){this.reset(),this.toHide=this.errorsFor(a)},elementValue:function(b){var c,d,e=a(b),f=b.type;return"radio"===f||"checkbox"===f?this.findByName(b.name).filter(":checked").val():"number"===f&&"undefined"!=typeof b.validity?b.validity.badInput?"NaN":e.val():(c=b.hasAttribute("contenteditable")?e.text():e.val(),"file"===f?"C:\\fakepath\\"===c.substr(0,12)?c.substr(12):(d=c.lastIndexOf("/"),d>=0?c.substr(d+1):(d=c.lastIndexOf("\\"),d>=0?c.substr(d+1):c)):"string"==typeof c?c.replace(/\r/g,""):c)},check:function(b){b=this.validationTargetFor(this.clean(b));var c,d,e,f,g=a(b).rules(),h=a.map(g,function(a,b){return b}).length,i=!1,j=this.elementValue(b);if("function"==typeof g.normalizer?f=g.normalizer:"function"==typeof this.settings.normalizer&&(f=this.settings.normalizer),f){if(j=f.call(b,j),"string"!=typeof j)throw new TypeError("The normalizer should return a string value.");delete g.normalizer}for(d in g){e={method:d,parameters:g[d]};try{if(c=a.validator.methods[d].call(this,j,b,e.parameters),"dependency-mismatch"===c&&1===h){i=!0;continue}if(i=!1,"pending"===c)return void(this.toHide=this.toHide.not(this.errorsFor(b)));if(!c)return this.formatAndAdd(b,e),!1}catch(k){throw this.settings.debug&&window.console&&console.log("Exception occurred when checking element "+b.id+", check the '"+e.method+"' method.",k),k instanceof TypeError&&(k.message+=". Exception occurred when checking element "+b.id+", check the '"+e.method+"' method."),k}}if(!i)return this.objectLength(g)&&this.successList.push(b),!0},customDataMessage:function(b,c){return a(b).data("msg"+c.charAt(0).toUpperCase()+c.substring(1).toLowerCase())||a(b).data("msg")},customMessage:function(a,b){var c=this.settings.messages[a];return c&&(c.constructor===String?c:c[b])},findDefined:function(){for(var a=0;aWarning: No message defined for "+b.name+""),e=/\$?\{(\d+)\}/g;return"function"==typeof d?d=d.call(this,c.parameters,b):e.test(d)&&(d=a.validator.format(d.replace(e,"{$1}"),c.parameters)),d},formatAndAdd:function(a,b){var c=this.defaultMessage(a,b);this.errorList.push({message:c,element:a,method:b.method}),this.errorMap[a.name]=c,this.submitted[a.name]=c},addWrapper:function(a){return this.settings.wrapper&&(a=a.add(a.parent(this.settings.wrapper))),a},defaultShowErrors:function(){var a,b,c;for(a=0;this.errorList[a];a++)c=this.errorList[a],this.settings.highlight&&this.settings.highlight.call(this,c.element,this.settings.errorClass,this.settings.validClass),this.showLabel(c.element,c.message);if(this.errorList.length&&(this.toShow=this.toShow.add(this.containers)),this.settings.success)for(a=0;this.successList[a];a++)this.showLabel(this.successList[a]);if(this.settings.unhighlight)for(a=0,b=this.validElements();b[a];a++)this.settings.unhighlight.call(this,b[a],this.settings.errorClass,this.settings.validClass);this.toHide=this.toHide.not(this.toShow),this.hideErrors(),this.addWrapper(this.toShow).show()},validElements:function(){return this.currentElements.not(this.invalidElements())},invalidElements:function(){return a(this.errorList).map(function(){return this.element})},showLabel:function(b,c){var d,e,f,g,h=this.errorsFor(b),i=this.idOrName(b),j=a(b).attr("aria-describedby");h.length?(h.removeClass(this.settings.validClass).addClass(this.settings.errorClass),h.html(c)):(h=a("<"+this.settings.errorElement+">").attr("id",i+"-error").addClass(this.settings.errorClass).html(c||""),d=h,this.settings.wrapper&&(d=h.hide().show().wrap("<"+this.settings.wrapper+"/>").parent()),this.labelContainer.length?this.labelContainer.append(d):this.settings.errorPlacement?this.settings.errorPlacement.call(this,d,a(b)):d.insertAfter(b),h.is("label")?h.attr("for",i):0===h.parents("label[for='"+this.escapeCssMeta(i)+"']").length&&(f=h.attr("id"),j?j.match(new RegExp("\\b"+this.escapeCssMeta(f)+"\\b"))||(j+=" "+f):j=f,a(b).attr("aria-describedby",j),e=this.groups[b.name],e&&(g=this,a.each(g.groups,function(b,c){c===e&&a("[name='"+g.escapeCssMeta(b)+"']",g.currentForm).attr("aria-describedby",h.attr("id"))})))),!c&&this.settings.success&&(h.text(""),"string"==typeof this.settings.success?h.addClass(this.settings.success):this.settings.success(h,b)),this.toShow=this.toShow.add(h)},errorsFor:function(b){var c=this.escapeCssMeta(this.idOrName(b)),d=a(b).attr("aria-describedby"),e="label[for='"+c+"'], label[for='"+c+"'] *";return d&&(e=e+", #"+this.escapeCssMeta(d).replace(/\s+/g,", #")),this.errors().filter(e)},escapeCssMeta:function(a){return a.replace(/([\\!"#$%&'()*+,.\/:;<=>?@\[\]^`{|}~])/g,"\\$1")},idOrName:function(a){return this.groups[a.name]||(this.checkable(a)?a.name:a.id||a.name)},validationTargetFor:function(b){return this.checkable(b)&&(b=this.findByName(b.name)),a(b).not(this.settings.ignore)[0]},checkable:function(a){return/radio|checkbox/i.test(a.type)},findByName:function(b){return a(this.currentForm).find("[name='"+this.escapeCssMeta(b)+"']")},getLength:function(b,c){switch(c.nodeName.toLowerCase()){case"select":return a("option:selected",c).length;case"input":if(this.checkable(c))return this.findByName(c.name).filter(":checked").length}return b.length},depend:function(a,b){return!this.dependTypes[typeof a]||this.dependTypes[typeof a](a,b)},dependTypes:{"boolean":function(a){return a},string:function(b,c){return!!a(b,c.form).length},"function":function(a,b){return a(b)}},optional:function(b){var c=this.elementValue(b);return!a.validator.methods.required.call(this,c,b)&&"dependency-mismatch"},startRequest:function(b){this.pending[b.name]||(this.pendingRequest++,a(b).addClass(this.settings.pendingClass),this.pending[b.name]=!0)},stopRequest:function(b,c){this.pendingRequest--,this.pendingRequest<0&&(this.pendingRequest=0),delete this.pending[b.name],a(b).removeClass(this.settings.pendingClass),c&&0===this.pendingRequest&&this.formSubmitted&&this.form()?(a(this.currentForm).submit(),this.submitButton&&a("input:hidden[name='"+this.submitButton.name+"']",this.currentForm).remove(),this.formSubmitted=!1):!c&&0===this.pendingRequest&&this.formSubmitted&&(a(this.currentForm).triggerHandler("invalid-form",[this]),this.formSubmitted=!1)},previousValue:function(b,c){return c="string"==typeof c&&c||"remote",a.data(b,"previousValue")||a.data(b,"previousValue",{old:null,valid:!0,message:this.defaultMessage(b,{method:c})})},destroy:function(){this.resetForm(),a(this.currentForm).off(".validate").removeData("validator").find(".validate-equalTo-blur").off(".validate-equalTo").removeClass("validate-equalTo-blur")}},classRuleSettings:{required:{required:!0},email:{email:!0},url:{url:!0},date:{date:!0},dateISO:{dateISO:!0},number:{number:!0},digits:{digits:!0},creditcard:{creditcard:!0}},addClassRules:function(b,c){b.constructor===String?this.classRuleSettings[b]=c:a.extend(this.classRuleSettings,b)},classRules:function(b){var c={},d=a(b).attr("class");return d&&a.each(d.split(" "),function(){this in a.validator.classRuleSettings&&a.extend(c,a.validator.classRuleSettings[this])}),c},normalizeAttributeRule:function(a,b,c,d){/min|max|step/.test(c)&&(null===b||/number|range|text/.test(b))&&(d=Number(d),isNaN(d)&&(d=void 0)),d||0===d?a[c]=d:b===c&&"range"!==b&&(a[c]=!0)},attributeRules:function(b){var c,d,e={},f=a(b),g=b.getAttribute("type");for(c in a.validator.methods)"required"===c?(d=b.getAttribute(c),""===d&&(d=!0),d=!!d):d=f.attr(c),this.normalizeAttributeRule(e,g,c,d);return e.maxlength&&/-1|2147483647|524288/.test(e.maxlength)&&delete e.maxlength,e},dataRules:function(b){var c,d,e={},f=a(b),g=b.getAttribute("type");for(c in a.validator.methods)d=f.data("rule"+c.charAt(0).toUpperCase()+c.substring(1).toLowerCase()),this.normalizeAttributeRule(e,g,c,d);return e},staticRules:function(b){var c={},d=a.data(b.form,"validator");return d.settings.rules&&(c=a.validator.normalizeRule(d.settings.rules[b.name])||{}),c},normalizeRules:function(b,c){return a.each(b,function(d,e){if(e===!1)return void delete b[d];if(e.param||e.depends){var f=!0;switch(typeof e.depends){case"string":f=!!a(e.depends,c.form).length;break;case"function":f=e.depends.call(c,c)}f?b[d]=void 0===e.param||e.param:(a.data(c.form,"validator").resetElements(a(c)),delete b[d])}}),a.each(b,function(d,e){b[d]=a.isFunction(e)&&"normalizer"!==d?e(c):e}),a.each(["minlength","maxlength"],function(){b[this]&&(b[this]=Number(b[this]))}),a.each(["rangelength","range"],function(){var c;b[this]&&(a.isArray(b[this])?b[this]=[Number(b[this][0]),Number(b[this][1])]:"string"==typeof b[this]&&(c=b[this].replace(/[\[\]]/g,"").split(/[\s,]+/),b[this]=[Number(c[0]),Number(c[1])]))}),a.validator.autoCreateRanges&&(null!=b.min&&null!=b.max&&(b.range=[b.min,b.max],delete b.min,delete b.max),null!=b.minlength&&null!=b.maxlength&&(b.rangelength=[b.minlength,b.maxlength],delete b.minlength,delete b.maxlength)),b},normalizeRule:function(b){if("string"==typeof b){var c={};a.each(b.split(/\s/),function(){c[this]=!0}),b=c}return b},addMethod:function(b,c,d){a.validator.methods[b]=c,a.validator.messages[b]=void 0!==d?d:a.validator.messages[b],c.length<3&&a.validator.addClassRules(b,a.validator.normalizeRule(b))},methods:{required:function(b,c,d){if(!this.depend(d,c))return"dependency-mismatch";if("select"===c.nodeName.toLowerCase()){var e=a(c).val();return e&&e.length>0}return this.checkable(c)?this.getLength(b,c)>0:b.length>0},email:function(a,b){return this.optional(b)||/^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/.test(a)},url:function(a,b){return this.optional(b)||/^(?:(?:(?:https?|ftp):)?\/\/)(?:\S+(?::\S*)?@)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)(?:\.(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)*(?:\.(?:[a-z\u00a1-\uffff]{2,})).?)(?::\d{2,5})?(?:[\/?#]\S*)?$/i.test(a)},date:function(a,b){return this.optional(b)||!/Invalid|NaN/.test(new Date(a).toString())},dateISO:function(a,b){return this.optional(b)||/^\d{4}[\/\-](0?[1-9]|1[012])[\/\-](0?[1-9]|[12][0-9]|3[01])$/.test(a)},number:function(a,b){return this.optional(b)||/^(?:-?\d+|-?\d{1,3}(?:,\d{3})+)?(?:\.\d+)?$/.test(a)},digits:function(a,b){return this.optional(b)||/^\d+$/.test(a)},minlength:function(b,c,d){var e=a.isArray(b)?b.length:this.getLength(b,c);return this.optional(c)||e>=d},maxlength:function(b,c,d){var e=a.isArray(b)?b.length:this.getLength(b,c);return this.optional(c)||e<=d},rangelength:function(b,c,d){var e=a.isArray(b)?b.length:this.getLength(b,c);return this.optional(c)||e>=d[0]&&e<=d[1]},min:function(a,b,c){return this.optional(b)||a>=c},max:function(a,b,c){return this.optional(b)||a<=c},range:function(a,b,c){return this.optional(b)||a>=c[0]&&a<=c[1]},step:function(b,c,d){var e,f=a(c).attr("type"),g="Step attribute on input type "+f+" is not supported.",h=["text","number","range"],i=new RegExp("\\b"+f+"\\b"),j=f&&!i.test(h.join()),k=function(a){var b=(""+a).match(/(?:\.(\d+))?$/);return b&&b[1]?b[1].length:0},l=function(a){return Math.round(a*Math.pow(10,e))},m=!0;if(j)throw new Error(g);return e=k(d),(k(b)>e||l(b)%l(d)!==0)&&(m=!1),this.optional(c)||m},equalTo:function(b,c,d){var e=a(d);return this.settings.onfocusout&&e.not(".validate-equalTo-blur").length&&e.addClass("validate-equalTo-blur").on("blur.validate-equalTo",function(){a(c).valid()}),b===e.val()},remote:function(b,c,d,e){if(this.optional(c))return"dependency-mismatch";e="string"==typeof e&&e||"remote";var f,g,h,i=this.previousValue(c,e);return this.settings.messages[c.name]||(this.settings.messages[c.name]={}),i.originalMessage=i.originalMessage||this.settings.messages[c.name][e],this.settings.messages[c.name][e]=i.message,d="string"==typeof d&&{url:d}||d,h=a.param(a.extend({data:b},d.data)),i.old===h?i.valid:(i.old=h,f=this,this.startRequest(c),g={},g[c.name]=b,a.ajax(a.extend(!0,{mode:"abort",port:"validate"+c.name,dataType:"json",data:g,context:f.currentForm,success:function(a){var d,g,h,j=a===!0||"true"===a;f.settings.messages[c.name][e]=i.originalMessage,j?(h=f.formSubmitted,f.resetInternals(),f.toHide=f.errorsFor(c),f.formSubmitted=h,f.successList.push(c),f.invalid[c.name]=!1,f.showErrors()):(d={},g=a||f.defaultMessage(c,{method:e,parameters:b}),d[c.name]=i.message=g,f.invalid[c.name]=!0,f.showErrors(d)),i.valid=j,f.stopRequest(c,j)}},d)),"pending")}}});var b,c={};return a.ajaxPrefilter?a.ajaxPrefilter(function(a,b,d){var e=a.port;"abort"===a.mode&&(c[e]&&c[e].abort(),c[e]=d)}):(b=a.ajax,a.ajax=function(d){var e=("mode"in d?d:a.ajaxSettings).mode,f=("port"in d?d:a.ajaxSettings).port;return"abort"===e?(c[f]&&c[f].abort(),c[f]=b.apply(this,arguments),c[f]):b.apply(this,arguments)}),a});!function(e){var n;if("function"==typeof define&&define.amd&&(define(e),n=!0),"object"==typeof exports&&(module.exports=e(),n=!0),!n){var t=window.Cookies,o=window.Cookies=e();o.noConflict=function(){return window.Cookies=t,o}}}(function(){function e(){for(var e=0,n={};e
Trong quá trình tìm hiểu về thiết kế website, chắc chắn bạn sẽ nghe đến Bootstrap. Vậy nó là gì? Liệu Bootstrap còn sử dụng được không? Lý do nên sử dụng framework này là gì? Cùng Tothost tìm hiểu nhé!
Mục lục
Mục lục
1. Bootstrap là gì?
Bootstrap là một Framework với 3 thành phần HTML, CSS và JavaScript được sử dụng để phát triển website chuẩn responsive.
Framework Bootstrap là một bộ sưu tập miễn phí của các mã nguồn mở và công cụ dùng để tạo ra một mẫu webiste hoàn chỉnh. Nó sẽ quy định sẵn kích thước, màu sắc, độ cao, độ rộng… người dùng có thể dễ dàng thao tác tạo ra các website theo mong muốn.
Mark Otto và Jacob Thorton (hai kỹ sư của Twitter – hiện giờ là X) là những người đã phát triển Bootstrap Framework. Lịch sử phát triển của framework phổ biến này thông qua một số cột mốc sau:
Bootstrap lần đầu xuất hiện trên GitHub vào ngày 19/8/2011. Ban đầu, nó được phát triển dưới dạng mã nguồn mở và có tên gọi là “Twitter Blueprint”.
Vào ngày 31/1/2012, các tác giả đã phát hành phiên bản thứ hai của Bootstrap. Phiên bản này đã bổ sung thêm 12 cột, giúp người dùng có thể dễ dàng tùy chỉnh và thiết kế trang web với nhiều kích thước màn hình khác nhau.
Sự phát triển tiếp theo của Bootstrap đến vào ngày 19/8/2013 với phiên bản thứ ba. Đây là phiên bản đầu tiên có giao diện dành riêng cho điện thoại thông minh. Sự cải tiến này đã giúp Bootstrap đạt được sự phổ biến và đứng đầu bảng xếp hạng các dự án trên GitHub.
Vào tháng 10/2014, các nhà phát triển tiếp tục cải tiến và ra mắt phiên bản thứ tư của Bootstrap.
Tháng 8/2015, Bootstrap 4 đã giới thiệu phiên bản Alpha đầu tiên.
Hiện tại, Bootstrap đã phát triển đến phiên bản 5 sau gần 10 năm phát triển. Nó vẫn duy trì vị trí dẫn đầu trong lĩnh vực thiết kế web với số lượng người dùng và sự quan tâm rất lớn.
1.1. Ba file chính của Bootstrap
Để hiểu rõ hơn về framework này, tiếp tục chúng ta sẽ đến với 3 file chính:
a. Bootstrap.CSS
Bootstrap CSS là một framework CSS hữu ích được dùng để quản lý và sắp xếp bố cục của trang web bạn đang thiết kế. Trong quá trình phát triển trang web, HTML chịu trách nhiệm quản lý cấu trúc và nội dung, trong khi CSS đảm nhiệm công việc tạo ra bố cục hấp dẫn. Vì vậy, Bootstrap tổng hợp cả hai khía cạnh này, tạo điều kiện thuận lợi cho người thiết kế web.
Sử dụng Bootstrap CSS, bạn không cần mất thời gian và công sức chỉnh sửa thủ công cho các yếu tố bố cục nhỏ. Thay vào đó, chỉ vơi vài thao tác đơn giản, bạn có thể tạo ra giao diện thống nhất cho nhiều trang web khác nhau. Bootstrap không giới hạn ở đó. Đặc biệt, nó cung cấp sẵn các kiểu dạng cho bảng biểu, cấu trúc hình ảnh, và kiểu văn bản. Điều này loại bỏ nhu cầu phải chờ đợi để tạo và khai báo các lựa chọn CSS một cách riêng lẻ.
b. Bootstrap.JS
Trong Bootstrap, nếu Bootstrap CSS đảm nhiệm việc quản lý bố cục của trang web, thì Bootstrap JS lại có nhiệm vụ quản lý các tệp JavaScript. Đây chính là phần quan trọng nhất, đóng vai trò lõi của Bootstrap và xử lý tương tác của trang web.
Để giúp người dùng dễ dàng thiết kế và tiết kiệm thời gian hơn, các nhà phát triển Bootstrap đã tích hợp jQuery, một thư viện mã nguồn mở chứa nhiều tính năng JavaScript tiện lợi. jQuery giúp người dùng:
Trích xuất dữ liệu từ các vị trí đã cài đặt trước.
Tạo các tiện ích thông qua các plugin JavaScript sẵn có.
Tạo hiệu ứng động bằng thuộc tính CSS.
Hỗ trợ thêm tính năng động vào trang web một cách dễ dàng.
c. Glyphicons
Trong thiết kế giao diện trang web, biểu tượng (Icons) đóng vai trò không thể thiếu. Chúng thường liên quan đến dữ liệu cụ thể và các hành động trên giao diện người dùng.
Bootstrap sử dụng bộ biểu tượng Glyphicons để đáp ứng nhu cầu này và cung cấp bộ Halflings Glyphicons miễn phí cho bạn sử dụng. Phiên bản miễn phí này có các biểu tượng cơ bản, nhưng vẫn đủ để đáp ứng các nhu cầu cơ bản.
Nếu bạn muốn sử dụng các biểu tượng có phong cách đặc biệt hơn, có thể xem xét việc mua các bộ biểu tượng Premium khác nhau. Chắc chắn rằng sử dụng các biểu tượng từ Glyphicons sẽ làm cho trang web của bạn trở nên hấp dẫn và nổi bật hơn.
1.2. Tính năng của Bootstrap
Như đã đề cập ở trên, 3 file chính được nén lại giúp người dùng dễ dàng tải, sử dụng và lưu trữ. Công cụ này được thiết kế dưới dạng Module nên có thể dễ dàng tích hợp với nhiều loại mã nguồn quen thuộc như WordPress, Joomla, Drupal, Magento,… Ngoài ra, Bootstrap cũng có nhiều tính năng nổi bật khác như:
Truy cập dễ dàng vào thư viện: Thư viện của Bootstrap rất phong phú với nhiều thành phần khác nhau, giúp người dùng dễ dàng tạo ra giao diện trang web theo ý muốn. Bạn có thể sử dụng font, typography, form, table, grid và nhiều thành phần khác để thiết kế trang web một cách dễ dàng.
Tùy chỉnh Framework: Bootstrap cho phép bạn tùy chỉnh framework dễ dàng. Sau đó, bạn có thể tải framework đã được tùy chỉnh về và sử dụng trong dự án xây dựng trang web của mình.
Tái sử dụng: Bạn cũng có khả năng lưu trữ và sử dụng lại các thành phần đã thiết kế cho các trang web tương lai.
Tích hợp jQuery: Bootstrap tích hợp sẵn jQuery, giúp tiết kiệm thời gian trong việc thiết kế, code, và lập trình trang web.
Giảm thiểu việc sử dụng hình ảnh làm biểu tượng và tối ưu tốc độ tải trang: Bằng cách sử dụng các biểu tượng từ các tệp Glyphicons, bạn có thể tăng tính thẩm mỹ của trang web và cải thiện tốc độ tải trang bằng cách giảm sự phụ thuộc vào hình ảnh làm biểu tượng.
2. Lý do nên sử dụng Bootstrap?
Khi tìm hiểu về thiết kế website nói chung hoặc Bootstrap nói riêng, chắc chắn bạn sẽ có câu hỏi rằng “Có nên sử dụng Bootstrap?”. Và để trả lời cho câu hỏi này, Tothost sẽ nêu ra cho bạn thấy những lý do nên sử dụng Bootstrap.
Dễ sử dụng: Bootstrap hoạt động dựa trên các tiêu chuẩn mã nguồn mở phổ biến: HTML, CSS và JavaScript. Điều này có nghĩa là người dùng cần có kiến thức cơ bản về ba ngôn ngữ này để sử dụng Bootstrap một cách hiệu quả. Hơn nữa, các nguồn mã nguồn này có thể dễ dàng được điều chỉnh và chỉnh sửa theo nhu cầu.
Tùy chỉnh linh hoạt: Bootstrap được xây dựng từ các nguồn mã nguồn mở, cho phép các thiết kế có sự linh hoạt cao hơn. Bây giờ, họ có thể lựa chọn những thuộc tính và phần tử phù hợp với dự án cụ thể mà họ đang thực hiện. Sử dụng qua CDN cũng giúp tiết kiệm dung lượng vì không cần tải mã nguồn về máy.
Chất lượng sản phẩm tốt: Bootstrap là sản phẩm của sự đóng góp của các lập trình viên xuất sắc từ khắp nơi trên thế giới. Nó đã trải qua nhiều giai đoạn nghiên cứu và kiểm thử trên nhiều thiết bị khác nhau trước khi ra mắt. Do đó, khi sử dụng bạn có thể tự tin rằng bạn đang làm việc với một công cụ mang đến chất lượng sản phẩm tốt nhất.
Tính tương thích cao: Điểm mạnh lớn nhất của Bootstrap là tính tương thích với hầu hết các trình duyệt và nền tảng. Điều này là rất quan trọng để đảm bảo trải nghiệm người dùng đồng nhất. Sử dụng hệ thống lưới (Grid System) cùng với các tiền xử lý Less và Sass, Bootstrap mặc định hỗ trợ thiết kế đáp ứng (Responsive) và ưu tiên hiển thị trên các thiết bị di động. Nó cũng có khả năng tự động điều chỉnh kích thước trang web để phù hợp với màn hình của máy tính để bàn, tablet hoặc laptop.
3. Hướng dẫn sử dụng Bootstrap
Nhờ những ưu điểm vượt trội, Bootstrap là Framework mà bạn không thể bỏ qua. Sau đây sẽ là hướng dẫn cách cài đặt và nhúng nó vào HTML về web hosting.
3.1. Cài đặt Bootstrap
Bạn có thể lựa chọn tải về theo 1 trong 2 cách sau đây:
Tải trực tiếp qua trang chủ: https://getbootstrap.com/. Sau khi tải về bạn sẽ thấy 2 file JS và CSS – đó là 2 trong 3 file chính. Sau đó bạn cần giải nén và cài đặt vào web hosting qua giao thức FTP. FTP giúp người dùng có thể trao đổi dữ liệu từ máy tính qua web hosting giúp quá trình làm việc đơn giản và thuận tiện hơn.
Tải qua CDN Bootstrap: Một cách khác bạn có thể thực hiện là nhúng Bootstrap thông qua CDN (Content Delivery Network) – các lập trình viên thường sử dụng cách này để tiết kiệm băng thông, tích hợp JavaScript, CSS, jQuerry Library mang đến nhiều tính năng hơn, nâng cao trải nghiệm người dùng và rút ngắn thời gian tải trang.
Trang chủ Bootstrap
3.2. Nhúng Bootstrap vào HTML
Nhúng qua liên kết của Bootstrap: Liên kết của Bootstrap sẽ cung cấp các đường link có sẵn, bạn chỉ cần dùng các đường link này để nhúng trực tiếp vào website đang thiết kế. Lưu ý, cách làm này có thể sẽ khiến site chậm hơn do phải kết nối với các website khác.
Nhúng bằng cách tự Host: Bạn có thể tự host bằng tệp tin index.html:
Bootstrap là một framework phổ biến và tối ưu cho phát triển trang web, mặc dù đã phát triển từ lâu nhưng nó vẫn được ưa chuộng. Hy vọng bài viết này đã đem lại cho bạn những kiến thức quan trọng về Bootstrap và sau đó bạn có thể làm theo hướng dẫn và sử dụng framework này.
Hiện nay, công nghệ trí tuệ nhân tạo đang bùng nổ mạnh mẽ tạo ra những tiềm năng to lớn trong nhiều lĩnh vực trong cuộc sống. Để làm được điều đó thì không thể thiếu AI tạo sinh (Generative AI). Vậy, Gen AI là gì? Nó có đóng góp gì trong thực tiễn? Hãy cùng tìm hiểu qua bài viết này nhé!
Cụm từ “đứt cáp quang biển” hay “cá mập cắn cáp” thường được nhắc tới mỗi khi kết nối mạng Việt Nam với quốc tế gặp vấn đề. Vậy cáp quang biển là gì? Việt Nam hiện tại đang có bao nhiêu tuyến cáp quang? Cùng TotHost tìm hiểu nhé!
Hiện nay trí tuệ nhân tạo đang là một chủ đề rất “nóng”, kèm theo đó là sự ra mắt của hàng loạt công cụ AI hữu ích nhưng mặt trái là tội phạm mạng có thể nguỵ trang phần mềm độc hại gắn mác “trí tuệ nhân tạo” để đánh lừa người dùng.
Khi tìm hiểu về lĩnh vực phần mềm bạn sẽ được tiếp cận với GitLab - một công cụ không thể thiếu với các đội nhóm phát triển dự án. Hãy cùng TotHost đào sâu thông tin về nền tảng này nhé!
Khi sử dụng Linux, bạn đã biết cách xem danh sách người dùng hiện đang đăng nhập chưa? Làm thế nào để tìm ra người dùng đăng nhập bằng cửa sổ terminal? Hãy cùng tìm hiểu thông qua bài viết này của TotHost nhé!
Việc nắm được mức độ sử dụng tài nguyên trên hệ thống của bạn là rất quan trọng bởi thông tin này có thể giúp bạn quản lý hệ thống tốt hơn. Điều này thể hiện rõ ở khâu xác định vấn đề của hiệu xuất và cách tối ưu hoá hệ thống. Hãy cùng TotHost tìm hiểu về cách kiểm tra ứng dụng đang chiếm nhiều bộ nhớ trong Linux.