dojo.provide("dijit.form.ValidationTextBox"); dojo.require("dojo.i18n"); dojo.require("dijit.form.TextBox"); dojo.require("dijit.Tooltip"); dojo.requireLocalization("dijit.form", "validate"); /*===== dijit.form.ValidationTextBox.__Constraints = function(){ // locale: String // locale used for validation, picks up value from this widget's lang attribute // _flags_: anything // various flags passed to regExpGen function this.locale = ""; this._flags_ = ""; } =====*/ dojo.declare( "dijit.form.ValidationTextBox", dijit.form.TextBox, { // summary: // A TextBox subclass with the ability to validate content of various types and provide user feedback. templatePath: dojo.moduleUrl("dijit.form", "templates/ValidationTextBox.html"), baseClass: "dijitTextBox", // default values for new subclass properties // required: Boolean // Can be true or false, default is false. required: false, // promptMessage: String // Hint string promptMessage: "", // invalidMessage: String // The message to display if value is invalid. invalidMessage: "$_unset_$", // read from the message file if not overridden // constraints: dijit.form.ValidationTextBox.__Constraints // user-defined object needed to pass parameters to the validator functions constraints: {}, // regExp: String // regular expression string used to validate the input // Do not specify both regExp and regExpGen regExp: ".*", // regExpGen: Function // user replaceable function used to generate regExp when dependent on constraints // Do not specify both regExp and regExpGen regExpGen: function(/*dijit.form.ValidationTextBox.__Constraints*/constraints){ return this.regExp; }, // state: String // Shows current state (ie, validation result) of input (Normal, Warning, or Error) state: "", // tooltipPosition: String[] // See description of dijit.Tooltip.defaultPosition for details on this parameter. tooltipPosition: [], _setValueAttr: function(){ // summary: // Hook so attr('value', ...) works. this.inherited(arguments); this.validate(this._focused); }, validator: function(/*anything*/value, /*dijit.form.ValidationTextBox.__Constraints*/constraints){ // summary: user replaceable function used to validate the text input against the regular expression. return (new RegExp("^(?:" + this.regExpGen(constraints) + ")"+(this.required?"":"?")+"$")).test(value) && (!this.required || !this._isEmpty(value)) && (this._isEmpty(value) || this.parse(value, constraints) !== undefined); // Boolean }, _isValidSubset: function(){ // summary: // Returns true if the value is either already valid or could be made valid by appending characters. return this.textbox.value.search(this._partialre) == 0; }, isValid: function(/*Boolean*/ isFocused){ // summary: Need to over-ride with your own validation code in subclasses return this.validator(this.textbox.value, this.constraints); }, _isEmpty: function(value){ // summary: Checks for whitespace return /^\s*$/.test(value); // Boolean }, getErrorMessage: function(/*Boolean*/ isFocused){ // summary: return an error message to show if appropriate return this.invalidMessage; // String }, getPromptMessage: function(/*Boolean*/ isFocused){ // summary: return a hint to show if appropriate return this.promptMessage; // String }, _maskValidSubsetError: true, validate: function(/*Boolean*/ isFocused){ // summary: // Called by oninit, onblur, and onkeypress. // description: // Show missing or invalid messages if appropriate, and highlight textbox field. var message = ""; var isValid = this.disabled || this.isValid(isFocused); if(isValid){ this._maskValidSubsetError = true; } var isValidSubset = !isValid && isFocused && this._isValidSubset(); var isEmpty = this._isEmpty(this.textbox.value); this.state = (isValid || (!this._hasBeenBlurred && isEmpty) || isValidSubset) ? "" : "Error"; if(this.state == "Error"){ this._maskValidSubsetError = false; } this._setStateClass(); dijit.setWaiState(this.focusNode, "invalid", isValid ? "false" : "true"); if(isFocused){ if(isEmpty){ message = this.getPromptMessage(true); } if(!message && (this.state == "Error" || (isValidSubset && !this._maskValidSubsetError))){ message = this.getErrorMessage(true); } } this.displayMessage(message); return isValid; }, // currently displayed message _message: "", displayMessage: function(/*String*/ message){ // summary: // User overridable method to display validation errors/hints. // By default uses a tooltip. if(this._message == message){ return; } this._message = message; dijit.hideTooltip(this.domNode); if(message){ dijit.showTooltip(message, this.domNode, this.tooltipPosition); } }, _refreshState: function(){ this.validate(this._focused); }, _update: function(/*Event*/e){ this._refreshState(); this._onMouse(e); // update CSS classes }, //////////// INITIALIZATION METHODS /////////////////////////////////////// constructor: function(){ this.constraints = {}; }, postMixInProperties: function(){ this.inherited(arguments); this.constraints.locale = this.lang; this.messages = dojo.i18n.getLocalization("dijit.form", "validate", this.lang); if(this.invalidMessage == "$_unset_$"){ this.invalidMessage = this.messages.invalidMessage; } var p = this.regExpGen(this.constraints); this.regExp = p; var partialre = ""; // parse the regexp and produce a new regexp that matches valid subsets // if the regexp is .* then there's no use in matching subsets since everything is valid if(p != ".*"){ this.regExp.replace(/\\.|\[\]|\[.*?[^\\]{1}\]|\{.*?\}|\(\?[=:!]|./g, function (re){ switch(re.charAt(0)){ case '{': case '+': case '?': case '*': case '^': case '$': case '|': case '(': partialre += re; break; case ")": partialre += "|$)"; break; default: partialre += "(?:"+re+"|$)"; break; } } );} try{ // this is needed for now since the above regexp parsing needs more test verification "".search(partialre); }catch(e){ // should never be here unless the original RE is bad or the parsing is bad partialre = this.regExp; console.debug('RegExp error in ' + this.declaredClass + ': ' + this.regExp); } // should never be here unless the original RE is bad or the parsing is bad this._partialre = "^(?:" + partialre + ")$"; }, _setDisabledAttr: function(/*Boolean*/ value){ this.inherited(arguments); // call FormValueWidget._setDisabledAttr() if(this.valueNode){ this.valueNode.disabled = value; } this._refreshState(); }, _setRequiredAttr: function(/*Boolean*/ value){ this.required = value; dijit.setWaiState(this.focusNode,"required", value); this._refreshState(); }, postCreate: function(){ if(dojo.isIE){ // IE INPUT tag fontFamily has to be set directly using STYLE var s = dojo.getComputedStyle(this.focusNode); if(s){ var ff = s.fontFamily; if(ff){ this.focusNode.style.fontFamily = ff; } } } this.inherited(arguments); } } ); dojo.declare( "dijit.form.MappedTextBox", dijit.form.ValidationTextBox, { // summary: // A dijit.form.ValidationTextBox subclass which provides a visible formatted display and a serializable // value in a hidden input field which is actually sent to the server. The visible display may // be locale-dependent and interactive. The value sent to the server is stored in a hidden // input field which uses the `name` attribute declared by the original widget. That value sent // to the serveris defined by the dijit.form.MappedTextBox.serialize method and is typically // locale-neutral. serialize: function(/*anything*/val, /*Object?*/options){ // summary: user replaceable function used to convert the attr('value') result to a String return val.toString ? val.toString() : ""; // String }, toString: function(){ // summary: display the widget as a printable string using the widget's value // TODO: seems like the filter() call here is unnecessary as attr('value') should do that var val = this.filter(this.attr('value')); return val != null ? (typeof val == "string" ? val : this.serialize(val, this.constraints)) : ""; // String }, validate: function(){ this.valueNode.value = this.toString(); return this.inherited(arguments); }, buildRendering: function(){ this.inherited(arguments); // Create a hidden node with the serialized value used for submit // (as opposed to the displayed value) var textbox = this.textbox; var valueNode = (this.valueNode = dojo.doc.createElement("input")); valueNode.setAttribute("type", textbox.type); dojo.style(valueNode, "display", "none"); this.valueNode.name = this.textbox.name; dojo.place(valueNode, textbox, "after"); // try to give the displayed node a different name, or ideally // remove that attribute altogether this.textbox.name = this.textbox.name + "_displayed_"; this.textbox.removeAttribute("name"); }, _setDisabledAttr: function(/*Boolean*/ value){ this.inherited(arguments); dojo.attr(this.valueNode, 'disabled', value); } } ); /*===== dijit.form.RangeBoundTextBox.__Constraints = function(){ // min: Number // Minimum signed value. Default is -Infinity // max: Number // Maximum signed value. Default is +Infinity this.min = min; this.max = max; } =====*/ dojo.declare( "dijit.form.RangeBoundTextBox", dijit.form.MappedTextBox, { // summary: // A dijit.form.MappedTextBox subclass which defines a range of valid values // // constraints: dijit.form.RangeBoundTextBox.__Constraints // // rangeMessage: String // The message to display if value is out-of-range /*===== constraints: {}, ======*/ rangeMessage: "", rangeCheck: function(/*Number*/ primitive, /*dijit.form.RangeBoundTextBox.__Constraints*/ constraints){ // summary: user replaceable function used to validate the range of the numeric input value var isMin = "min" in constraints; var isMax = "max" in constraints; if(isMin || isMax){ return (!isMin || this.compare(primitive,constraints.min) >= 0) && (!isMax || this.compare(primitive,constraints.max) <= 0); } return true; // Boolean }, isInRange: function(/*Boolean*/ isFocused){ // summary: Need to over-ride with your own validation code in subclasses return this.rangeCheck(this.attr('value'), this.constraints); }, _isDefinitelyOutOfRange: function(){ // summary: // Returns true if the value is out of range and will remain // out of range even if the user types more characters var val = this.attr('value'); var isTooLittle = false; var isTooMuch = false; if("min" in this.constraints){ var min = this.constraints.min; val = this.compare(val, ((typeof min == "number") && min >= 0 && val !=0)? 0 : min); isTooLittle = (typeof val == "number") && val < 0; } if("max" in this.constraints){ var max = this.constraints.max; val = this.compare(val, ((typeof max != "number") || max > 0)? max : 0); isTooMuch = (typeof val == "number") && val > 0; } return isTooLittle || isTooMuch; }, _isValidSubset: function(){ return this.inherited(arguments) && !this._isDefinitelyOutOfRange(); }, isValid: function(/*Boolean*/ isFocused){ return this.inherited(arguments) && ((this._isEmpty(this.textbox.value) && !this.required) || this.isInRange(isFocused)); // Boolean }, getErrorMessage: function(/*Boolean*/ isFocused){ if(dijit.form.RangeBoundTextBox.superclass.isValid.call(this, false) && !this.isInRange(isFocused)){ return this.rangeMessage; } // String return this.inherited(arguments); }, postMixInProperties: function(){ this.inherited(arguments); if(!this.rangeMessage){ this.messages = dojo.i18n.getLocalization("dijit.form", "validate", this.lang); this.rangeMessage = this.messages.rangeMessage; } }, postCreate: function(){ this.inherited(arguments); if(this.constraints.min !== undefined){ dijit.setWaiState(this.focusNode, "valuemin", this.constraints.min); } if(this.constraints.max !== undefined){ dijit.setWaiState(this.focusNode, "valuemax", this.constraints.max); } }, _setValueAttr: function(/*Number*/ value, /*Boolean?*/ priorityChange){ // summary: // Hook so attr('value', ...) works. dijit.setWaiState(this.focusNode, "valuenow", value); this.inherited(arguments); } } );