309 lines
10 KiB
JavaScript
309 lines
10 KiB
JavaScript
|
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, "zh,pt,da,tr,ru,de,sv,ja,he,fi,nb,el,ar,pt-pt,ROOT,cs,fr,es,ko,nl,zh-tw,pl,it,hu");
|
||
|
|
||
|
/*=====
|
||
|
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.
|
||
|
|
||
|
templateString:"<div class=\"dijit dijitReset dijitInlineTable dijitLeft\"\n\tid=\"widget_${id}\"\n\tdojoAttachEvent=\"onmouseenter:_onMouse,onmouseleave:_onMouse,onmousedown:_onMouse\" waiRole=\"presentation\"\n\t><div style=\"overflow:hidden;\"\n\t\t><div class=\"dijitReset dijitValidationIcon\"><br></div\n\t\t><div class=\"dijitReset dijitValidationIconText\">Χ</div\n\t\t><div class=\"dijitReset dijitInputField\"\n\t\t\t><input class=\"dijitReset\" dojoAttachPoint='textbox,focusNode' dojoAttachEvent='onfocus:_update,onkeyup:_onkeyup,onblur:_onMouse,onkeypress:_onKeyPress' autocomplete=\"off\"\n\t\t\ttype='${type}' name='${name}'\n\t\t/></div\n\t></div\n></div>\n",
|
||
|
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: [],
|
||
|
|
||
|
setValue: function(){
|
||
|
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
|
||
|
},
|
||
|
|
||
|
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
|
||
|
},
|
||
|
|
||
|
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.isValid(isFocused);
|
||
|
var isEmpty = this._isEmpty(this.textbox.value);
|
||
|
this.state = (isValid || (!this._hasBeenBlurred && isEmpty)) ? "" : "Error";
|
||
|
this._setStateClass();
|
||
|
dijit.setWaiState(this.focusNode, "invalid", isValid ? "false" : "true");
|
||
|
if(isFocused){
|
||
|
if(isEmpty){
|
||
|
message = this.getPromptMessage(true);
|
||
|
}
|
||
|
if(!message && this.state == "Error"){
|
||
|
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
|
||
|
},
|
||
|
|
||
|
_onkeyup: function(/*Event*/e){
|
||
|
this._update(e);
|
||
|
this.onkeyup(e);
|
||
|
},
|
||
|
|
||
|
//////////// 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;
|
||
|
}
|
||
|
}
|
||
|
);
|
||
|
|
||
|
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 getValue() 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
|
||
|
var val = this.filter(this.getValue());
|
||
|
return val != null ? (typeof val == "string" ? val : this.serialize(val, this.constraints)) : ""; // String
|
||
|
},
|
||
|
|
||
|
validate: function(){
|
||
|
this.valueNode.value = this.toString();
|
||
|
return this.inherited(arguments);
|
||
|
},
|
||
|
|
||
|
setAttribute: function(/*String*/ attr, /*anything*/ value){
|
||
|
this.inherited(arguments);
|
||
|
switch(attr){
|
||
|
case "disabled":
|
||
|
if(this.valueNode){
|
||
|
this.valueNode.disabled = this.disabled;
|
||
|
}
|
||
|
}
|
||
|
},
|
||
|
|
||
|
postCreate: function(){
|
||
|
var textbox = this.textbox;
|
||
|
var valueNode = (this.valueNode = dojo.doc.createElement("input"));
|
||
|
valueNode.setAttribute("type", textbox.type);
|
||
|
valueNode.setAttribute("value", this.toString());
|
||
|
dojo.style(valueNode, "display", "none");
|
||
|
valueNode.name = this.textbox.name;
|
||
|
valueNode.disabled = this.textbox.disabled;
|
||
|
this.textbox.name = this.textbox.name + "_displayed_";
|
||
|
this.textbox.removeAttribute("name");
|
||
|
dojo.place(valueNode, textbox, "after");
|
||
|
|
||
|
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:
|
||
|
// 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: "",
|
||
|
|
||
|
compare: function(/*anything*/val1, /*anything*/val2){
|
||
|
// summary: compare 2 values
|
||
|
return val1 - val2; // anything
|
||
|
},
|
||
|
|
||
|
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.getValue(), this.constraints);
|
||
|
},
|
||
|
|
||
|
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);
|
||
|
}
|
||
|
},
|
||
|
|
||
|
setValue: function(/*Number*/ value, /*Boolean?*/ priorityChange){
|
||
|
dijit.setWaiState(this.focusNode, "valuenow", value);
|
||
|
this.inherited('setValue', arguments);
|
||
|
}
|
||
|
}
|
||
|
);
|
||
|
|
||
|
}
|