You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
487 lines
17 KiB
JavaScript
487 lines
17 KiB
JavaScript
/*
|
|
Copyright (c) 2004-2011, The Dojo Foundation All Rights Reserved.
|
|
Available via Academic Free License >= 2.1 OR the modified BSD license.
|
|
see: http://dojotoolkit.org/license for details
|
|
*/
|
|
|
|
|
|
if(!dojo._hasResource["dijit.form.ValidationTextBox"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
|
|
dojo._hasResource["dijit.form.ValidationTextBox"] = true;
|
|
dojo.provide("dijit.form.ValidationTextBox");
|
|
dojo.require("dojo.i18n");
|
|
dojo.require("dijit.form.TextBox");
|
|
dojo.require("dijit.Tooltip");
|
|
dojo.requireLocalization("dijit.form", "validate", null, "ROOT,ar,ca,cs,da,de,el,es,fi,fr,he,hu,it,ja,kk,ko,nb,nl,pl,pt,pt-pt,ro,ru,sk,sl,sv,th,tr,zh,zh-tw");
|
|
|
|
|
|
/*=====
|
|
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:
|
|
// Base class for textbox widgets with the ability to validate content of various types and provide user feedback.
|
|
// tags:
|
|
// protected
|
|
|
|
templateString: dojo.cache("dijit.form", "templates/ValidationTextBox.html", "<div class=\"dijit dijitReset dijitInlineTable dijitLeft\"\n\tid=\"widget_${id}\" role=\"presentation\"\n\t><div class='dijitReset dijitValidationContainer'\n\t\t><input class=\"dijitReset dijitInputField dijitValidationIcon dijitValidationInner\" value=\"Χ \" type=\"text\" tabIndex=\"-1\" readonly=\"readonly\" role=\"presentation\"\n\t/></div\n\t><div class=\"dijitReset dijitInputField dijitInputContainer\"\n\t\t><input class=\"dijitReset dijitInputInner\" dojoAttachPoint='textbox,focusNode' autocomplete=\"off\"\n\t\t\t${!nameAttrSetting} type='${type}'\n\t/></div\n></div>\n"),
|
|
baseClass: "dijitTextBox dijitValidationTextBox",
|
|
|
|
// required: Boolean
|
|
// User is required to enter data into this field.
|
|
required: false,
|
|
|
|
// promptMessage: String
|
|
// If defined, display this hint string immediately on focus to the textbox, if empty.
|
|
// Also displays if the textbox value is Incomplete (not yet valid but will be with additional input).
|
|
// Think of this like a tooltip that tells the user what to do, not an error message
|
|
// that tells the user what they've done wrong.
|
|
//
|
|
// Message disappears when user starts typing.
|
|
promptMessage: "",
|
|
|
|
// invalidMessage: String
|
|
// The message to display if value is invalid.
|
|
// The translated string value is read from the message file by default.
|
|
// Set to "" to use the promptMessage instead.
|
|
invalidMessage: "$_unset_$",
|
|
|
|
// missingMessage: String
|
|
// The message to display if value is empty and the field is required.
|
|
// The translated string value is read from the message file by default.
|
|
// Set to "" to use the invalidMessage instead.
|
|
missingMessage: "$_unset_$",
|
|
|
|
// message: String
|
|
// Currently error/prompt message.
|
|
// When using the default tooltip implementation, this will only be
|
|
// displayed when the field is focused.
|
|
message: "",
|
|
|
|
// constraints: dijit.form.ValidationTextBox.__Constraints
|
|
// user-defined object needed to pass parameters to the validator functions
|
|
constraints: {},
|
|
|
|
// regExp: [extension protected] String
|
|
// regular expression string used to validate the input
|
|
// Do not specify both regExp and regExpGen
|
|
regExp: ".*",
|
|
|
|
regExpGen: function(/*dijit.form.ValidationTextBox.__Constraints*/ constraints){
|
|
// summary:
|
|
// Overridable function used to generate regExp when dependent on constraints.
|
|
// Do not specify both regExp and regExpGen.
|
|
// tags:
|
|
// extension protected
|
|
return this.regExp; // String
|
|
},
|
|
|
|
// state: [readonly] String
|
|
// Shows current state (ie, validation result) of input (""=Normal, Incomplete, or Error)
|
|
state: "",
|
|
|
|
// tooltipPosition: String[]
|
|
// See description of `dijit.Tooltip.defaultPosition` for details on this parameter.
|
|
tooltipPosition: [],
|
|
|
|
_setValueAttr: function(){
|
|
// summary:
|
|
// Hook so set('value', ...) works.
|
|
this.inherited(arguments);
|
|
this.validate(this._focused);
|
|
},
|
|
|
|
validator: function(/*anything*/ value, /*dijit.form.ValidationTextBox.__Constraints*/ constraints){
|
|
// summary:
|
|
// Overridable function used to validate the text input against the regular expression.
|
|
// tags:
|
|
// protected
|
|
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.
|
|
// This is used for validation while the user [may be] still typing.
|
|
return this.textbox.value.search(this._partialre) == 0;
|
|
},
|
|
|
|
isValid: function(/*Boolean*/ isFocused){
|
|
// summary:
|
|
// Tests if value is valid.
|
|
// Can override with your own routine in a subclass.
|
|
// tags:
|
|
// protected
|
|
return this.validator(this.textbox.value, this.constraints);
|
|
},
|
|
|
|
_isEmpty: function(value){
|
|
// summary:
|
|
// Checks for whitespace
|
|
return (this.trim ? /^\s*$/ : /^$/).test(value); // Boolean
|
|
},
|
|
|
|
getErrorMessage: function(/*Boolean*/ isFocused){
|
|
// summary:
|
|
// Return an error message to show if appropriate
|
|
// tags:
|
|
// protected
|
|
return (this.required && this._isEmpty(this.textbox.value)) ? this.missingMessage : this.invalidMessage; // String
|
|
},
|
|
|
|
getPromptMessage: function(/*Boolean*/ isFocused){
|
|
// summary:
|
|
// Return a hint message to show when widget is first focused
|
|
// tags:
|
|
// protected
|
|
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.
|
|
// tags:
|
|
// protected
|
|
var message = "";
|
|
var isValid = this.disabled || this.isValid(isFocused);
|
|
if(isValid){ this._maskValidSubsetError = true; }
|
|
var isEmpty = this._isEmpty(this.textbox.value);
|
|
var isValidSubset = !isValid && isFocused && this._isValidSubset();
|
|
this._set("state", isValid ? "" : (((((!this._hasBeenBlurred || isFocused) && isEmpty) || isValidSubset) && this._maskValidSubsetError) ? "Incomplete" : "Error"));
|
|
dijit.setWaiState(this.focusNode, "invalid", isValid ? "false" : "true");
|
|
|
|
if(this.state == "Error"){
|
|
this._maskValidSubsetError = isFocused && isValidSubset; // we want the error to show up after a blur and refocus
|
|
message = this.getErrorMessage(isFocused);
|
|
}else if(this.state == "Incomplete"){
|
|
message = this.getPromptMessage(isFocused); // show the prompt whenever the value is not yet complete
|
|
this._maskValidSubsetError = !this._hasBeenBlurred || isFocused; // no Incomplete warnings while focused
|
|
}else if(isEmpty){
|
|
message = this.getPromptMessage(isFocused); // show the prompt whenever there's no error and no text
|
|
}
|
|
this.set("message", message);
|
|
|
|
return isValid;
|
|
},
|
|
|
|
displayMessage: function(/*String*/ message){
|
|
// summary:
|
|
// Overridable method to display validation errors/hints.
|
|
// By default uses a tooltip.
|
|
// tags:
|
|
// extension
|
|
dijit.hideTooltip(this.domNode);
|
|
if(message && this._focused){
|
|
dijit.showTooltip(message, this.domNode, this.tooltipPosition, !this.isLeftToRight());
|
|
}
|
|
},
|
|
|
|
_refreshState: function(){
|
|
// Overrides TextBox._refreshState()
|
|
this.validate(this._focused);
|
|
this.inherited(arguments);
|
|
},
|
|
|
|
//////////// INITIALIZATION METHODS ///////////////////////////////////////
|
|
|
|
constructor: function(){
|
|
this.constraints = {};
|
|
},
|
|
|
|
_setConstraintsAttr: function(/*Object*/ constraints){
|
|
if(!constraints.locale && this.lang){
|
|
constraints.locale = this.lang;
|
|
}
|
|
this._set("constraints", constraints);
|
|
this._computePartialRE();
|
|
},
|
|
|
|
_computePartialRE: function(){
|
|
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.warn('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 + ")$";
|
|
},
|
|
|
|
postMixInProperties: function(){
|
|
this.inherited(arguments);
|
|
this.messages = dojo.i18n.getLocalization("dijit.form", "validate", this.lang);
|
|
if(this.invalidMessage == "$_unset_$"){ this.invalidMessage = this.messages.invalidMessage; }
|
|
if(!this.invalidMessage){ this.invalidMessage = this.promptMessage; }
|
|
if(this.missingMessage == "$_unset_$"){ this.missingMessage = this.messages.missingMessage; }
|
|
if(!this.missingMessage){ this.missingMessage = this.invalidMessage; }
|
|
this._setConstraintsAttr(this.constraints); // this needs to happen now (and later) due to codependency on _set*Attr calls attachPoints
|
|
},
|
|
|
|
_setDisabledAttr: function(/*Boolean*/ value){
|
|
this.inherited(arguments); // call FormValueWidget._setDisabledAttr()
|
|
this._refreshState();
|
|
},
|
|
|
|
_setRequiredAttr: function(/*Boolean*/ value){
|
|
this._set("required", value);
|
|
dijit.setWaiState(this.focusNode, "required", value);
|
|
this._refreshState();
|
|
},
|
|
|
|
_setMessageAttr: function(/*String*/ message){
|
|
this._set("message", message);
|
|
this.displayMessage(message);
|
|
},
|
|
|
|
reset:function(){
|
|
// Overrides dijit.form.TextBox.reset() by also
|
|
// hiding errors about partial matches
|
|
this._maskValidSubsetError = true;
|
|
this.inherited(arguments);
|
|
},
|
|
|
|
_onBlur: function(){
|
|
// the message still exists but for back-compat, and to erase the tooltip
|
|
// (if the message is being displayed as a tooltip), call displayMessage('')
|
|
this.displayMessage('');
|
|
|
|
this.inherited(arguments);
|
|
}
|
|
}
|
|
);
|
|
|
|
dojo.declare(
|
|
"dijit.form.MappedTextBox",
|
|
dijit.form.ValidationTextBox,
|
|
{
|
|
// summary:
|
|
// A dijit.form.ValidationTextBox subclass which provides a base class for widgets that have
|
|
// a visible formatted display value, and a serializable
|
|
// value in a hidden input field which is actually sent to the server.
|
|
// description:
|
|
// 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 server is defined by the dijit.form.MappedTextBox.serialize method and is typically
|
|
// locale-neutral.
|
|
// tags:
|
|
// protected
|
|
|
|
postMixInProperties: function(){
|
|
this.inherited(arguments);
|
|
|
|
// we want the name attribute to go to the hidden <input>, not the displayed <input>,
|
|
// so override _FormWidget.postMixInProperties() setting of nameAttrSetting
|
|
this.nameAttrSetting = "";
|
|
},
|
|
|
|
serialize: function(/*anything*/ val, /*Object?*/ options){
|
|
// summary:
|
|
// Overridable function used to convert the get('value') result to a canonical
|
|
// (non-localized) string. For example, will print dates in ISO format, and
|
|
// numbers the same way as they are represented in javascript.
|
|
// tags:
|
|
// protected extension
|
|
return val.toString ? val.toString() : ""; // String
|
|
},
|
|
|
|
toString: function(){
|
|
// summary:
|
|
// Returns widget as a printable string using the widget's value
|
|
// tags:
|
|
// protected
|
|
var val = this.filter(this.get('value')); // call filter in case value is nonstring and filter has been customized
|
|
return val != null ? (typeof val == "string" ? val : this.serialize(val, this.constraints)) : ""; // String
|
|
},
|
|
|
|
validate: function(){
|
|
// Overrides `dijit.form.TextBox.validate`
|
|
this.valueNode.value = this.toString();
|
|
return this.inherited(arguments);
|
|
},
|
|
|
|
buildRendering: function(){
|
|
// Overrides `dijit._Templated.buildRendering`
|
|
|
|
this.inherited(arguments);
|
|
|
|
// Create a hidden <input> node with the serialized value used for submit
|
|
// (as opposed to the displayed value).
|
|
// Passing in name as markup rather than calling dojo.create() with an attrs argument
|
|
// to make dojo.query(input[name=...]) work on IE. (see #8660)
|
|
this.valueNode = dojo.place("<input type='hidden'" + (this.name ? " name='" + this.name.replace(/'/g, """) + "'" : "") + "/>", this.textbox, "after");
|
|
},
|
|
|
|
reset: function(){
|
|
// Overrides `dijit.form.ValidationTextBox.reset` to
|
|
// reset the hidden textbox value to ''
|
|
this.valueNode.value = '';
|
|
this.inherited(arguments);
|
|
}
|
|
}
|
|
);
|
|
|
|
/*=====
|
|
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:
|
|
// Base class for textbox form widgets which defines a range of valid values.
|
|
|
|
// rangeMessage: String
|
|
// The message to display if value is out-of-range
|
|
rangeMessage: "",
|
|
|
|
/*=====
|
|
// constraints: dijit.form.RangeBoundTextBox.__Constraints
|
|
constraints: {},
|
|
======*/
|
|
|
|
rangeCheck: function(/*Number*/ primitive, /*dijit.form.RangeBoundTextBox.__Constraints*/ constraints){
|
|
// summary:
|
|
// Overridable function used to validate the range of the numeric input value.
|
|
// tags:
|
|
// protected
|
|
return ("min" in constraints? (this.compare(primitive,constraints.min) >= 0) : true) &&
|
|
("max" in constraints? (this.compare(primitive,constraints.max) <= 0) : true); // Boolean
|
|
},
|
|
|
|
isInRange: function(/*Boolean*/ isFocused){
|
|
// summary:
|
|
// Tests if the value is in the min/max range specified in constraints
|
|
// tags:
|
|
// protected
|
|
return this.rangeCheck(this.get('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.get('value');
|
|
var isTooLittle = false;
|
|
var isTooMuch = false;
|
|
if("min" in this.constraints){
|
|
var min = this.constraints.min;
|
|
min = this.compare(val, ((typeof min == "number") && min >= 0 && val !=0) ? 0 : min);
|
|
isTooLittle = (typeof min == "number") && min < 0;
|
|
}
|
|
if("max" in this.constraints){
|
|
var max = this.constraints.max;
|
|
max = this.compare(val, ((typeof max != "number") || max > 0) ? max : 0);
|
|
isTooMuch = (typeof max == "number") && max > 0;
|
|
}
|
|
return isTooLittle || isTooMuch;
|
|
},
|
|
|
|
_isValidSubset: function(){
|
|
// summary:
|
|
// Overrides `dijit.form.ValidationTextBox._isValidSubset`.
|
|
// Returns true if the input is syntactically valid, and either within
|
|
// range or could be made in range by more typing.
|
|
return this.inherited(arguments) && !this._isDefinitelyOutOfRange();
|
|
},
|
|
|
|
isValid: function(/*Boolean*/ isFocused){
|
|
// Overrides dijit.form.ValidationTextBox.isValid to check that the value is also in range.
|
|
return this.inherited(arguments) &&
|
|
((this._isEmpty(this.textbox.value) && !this.required) || this.isInRange(isFocused)); // Boolean
|
|
},
|
|
|
|
getErrorMessage: function(/*Boolean*/ isFocused){
|
|
// Overrides dijit.form.ValidationTextBox.getErrorMessage to print "out of range" message if appropriate
|
|
var v = this.get('value');
|
|
if(v !== null && v !== '' && v !== undefined && (typeof v != "number" || !isNaN(v)) && !this.isInRange(isFocused)){ // don't check isInRange w/o a real value
|
|
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;
|
|
}
|
|
},
|
|
|
|
_setConstraintsAttr: function(/*Object*/ constraints){
|
|
this.inherited(arguments);
|
|
if(this.focusNode){ // not set when called from postMixInProperties
|
|
if(this.constraints.min !== undefined){
|
|
dijit.setWaiState(this.focusNode, "valuemin", this.constraints.min);
|
|
}else{
|
|
dijit.removeWaiState(this.focusNode, "valuemin");
|
|
}
|
|
if(this.constraints.max !== undefined){
|
|
dijit.setWaiState(this.focusNode, "valuemax", this.constraints.max);
|
|
}else{
|
|
dijit.removeWaiState(this.focusNode, "valuemax");
|
|
}
|
|
}
|
|
},
|
|
|
|
_setValueAttr: function(/*Number*/ value, /*Boolean?*/ priorityChange){
|
|
// summary:
|
|
// Hook so set('value', ...) works.
|
|
|
|
dijit.setWaiState(this.focusNode, "valuenow", value);
|
|
this.inherited(arguments);
|
|
}
|
|
}
|
|
);
|
|
|
|
}
|