<HTML><HEAD>
<SCRIPT>var isomorphicDir="../../isomorphic/";</SCRIPT>
<SCRIPT SRC=../../isomorphic/system/modules/ISC_Core.js></SCRIPT>
<SCRIPT SRC=../../isomorphic/system/modules/ISC_Foundation.js></SCRIPT>
<SCRIPT SRC=../../isomorphic/system/modules/ISC_Containers.js></SCRIPT>
<SCRIPT SRC=../../isomorphic/system/modules/ISC_Grids.js></SCRIPT>
<SCRIPT SRC=../../isomorphic/system/modules/ISC_Forms.js></SCRIPT>
<SCRIPT SRC=../../isomorphic/system/modules/ISC_DataBinding.js></SCRIPT>
<SCRIPT SRC=../../isomorphic/skins/SmartClient/load_skin.js></SCRIPT>
</HEAD><BODY BGCOLOR='papayawhip' MARGINHEIGHT=0 MARGINWIDTH=0 LEFTMARGIN=0 TOPMARGIN=0>
<TABLE WIDTH=100% CELLSPACING=0 CELLPADDING=5 BORDER=0><TR><TD CLASS=pageHeader BGCOLOR=WHITE>
Form item validation example
</TD><TD CLASS=pageHeader ALIGN=RIGHT BGCOLOR=WHITE>
Isomorphic SmartClient
</TD></TR></TABLE><TABLE WIDTH=100% CELLSPACING=0 CELLPADDING=0 BORDER=0><TR>
<TD BGCOLOR=336666><IMG SRC=images/blank.gif WIDTH=1 HEIGHT=4></TD></TR></TABLE>
<!--------------------------
Example code starts here
---------------------------->
<SCRIPT>
var formItems = [
{name:"required", title:"required", required:true},
{name:"custom", title:"custom - confirm dialog",
validators:[
{condition:"confirm('Accept the value \"'+value+'\" for custom field?')",
errorMessage:"Custom Field Value Rejected", clientOnly:true}
]
},
{name:"requiredIf", title:"requiredIf - true",
validators:[
{type:"requiredIf", errorMessage:"Value must be non-empty.", expression:"true"}
]
},
{name:"isBoolean", title:"isBoolean",
validators:[
{type:"isBoolean", errorMessage:"Value must be boolean."}
]
},
{name:"isInteger", title:"isInteger",
validators:[
{type:"isInteger", errorMessage:"Value must be an integer."}
]
},
{name:"boundedIntegerRange", type:"integer", title:"integerRange 10-100",
validators:[
{type:"integerRange", errorMessage:"Value must be between 10 and 100.", min:10, max:100}
]
},
{name:"lowerBoundedIntegerRange", type:"integer", title:"integerRange 10-",
validators:[
{type:"integerRange", errorMessage:"Value must be >= 10.", min:10}
]
},
{name:"upperBoundedIntegerRange", type:"integer", title:"integerRange -100",
validators:[
{type:"integerRange", errorMessage:"Value must be <= 100.", max:100}
]
},
{name:"boundedLengthRange", title:"lengthRange 4-8",
validators:[
{type:"lengthRange", errorMessage:"Value must be 4-8 characters long.", min:4, max:8}
]
},
{name:"lowerBoundedLengthRange", title:"lengthRange 4-",
validators:[
{type:"lengthRange", errorMessage:"Value must be 4 or more characters long.", min:4}
]
},
{name:"upperBoundedLengthRange", title:"lengthRange -8",
validators:[
{type:"lengthRange", errorMessage:"Value must be 8 or fewer characters long.", max:8}
]
},
{name:"matchesField", title:"matchesField - field 1",
validators:[
{type:"matchesField", errorMessage:"Value must match value of first field.", otherField:"required"}
]
},
{name:"isOneOf", title:"isOneOf ['a','b','c']",
validators:[
{type:"isOneOf", errorMessage:"Value must be one of ['a','b','c'].", list:['a','b','c']}
]
},
{name:"contains", title:"contains 'abc'",
validators:[
{type:"contains", errorMessage:"Value must contain the substring 'abc'.", substring:"abc"}
]
},
{name:"doesntContain", title:"doesntContain ' '",
validators:[
{type:"doesntContain", errorMessage:"Value must not contain any spaces.", substring:" "}
]
},
{name:"substringCount", title:"substringCount '.' == 3",
validators:[
{type:"substringCount", errorMessage:"Value must contain exactly three dots.", substring:".",
operator:"==", count:3}
]
},
{name:"regexp", title:"regexp zipcode format",
validators:[
{type:"regexp", errorMessage:"Value must be in zipcode format.", expression:/^\d{5}(-\d{4}){0,1}$/}
]
},
{type:"rowSpacer"},
// Submit button for form - will perform automatic client side validation before submission
// Note: we would have to set canSubmit to true on the DymamicForm to allow form submission.
// {title:"Submit Form", type:"submit", align:"center"}
// Button to call validation demonstration function
{title:"Validate Form", type:"button", click:"validateForm()", align:"center"}
],
formValues = {
custom:"x",
isBoolean:"x",
isInteger:"x",
boundedIntegerRange:"x",
lowerBoundedIntegerRange:"x",
upperBoundedIntegerRange:"x",
boundedLengthRange:"x",
lowerBoundedLengthRange:"x",
upperBoundedLengthRange:"xxxxxxxxx",
matchesField:"x",
isOneOf:"x",
contains:"x",
doesntContain:"x x",
substringCount:"x",
regexp:"x"
};
DynamicForm.create({
ID:"simpleForm",
left:20,
top:40,
items:formItems,
values:formValues,
width:600,
titleWidth:200
});
// A function to demonstrate form validation, and alert on success
// Note: Validation is performed automatically on form submission -
// no explicit call to the form.validate() function usually required.
function validateForm(){
if(simpleForm.validate()){
alert ("Form validation was successful!");
simpleForm.redraw();
};
};
</SCRIPT>
</BODY>
</HTML>