This trick is very useful if we have multiple controls. Then we can use only one validator control to validate it. It will reduce the page size dramatically and improve the performance because every validator is rendered as span on the page and a page can contain hundreds of controls which makes the page very heavy.
So in my example, I have several textboxes(Dynamically created) and I am using only one custom validator for this.
My markup(aspx) page is:
<body>
<form id="form1" runat="server">
<div>
<asp:CustomValidator ID="CustomValidator1" runat="server" ></asp:CustomValidator>
<asp:ValidationSummary ID="ValidationSummary1" runat="server" />
</div>
</form>
</body>
I am associating the validator from server side on
onfocus event of the Textboxes from server side as:
for (int i = 0; i < 10; i++)
{
TextBox tb = new TextBox();
tb.ID = "tb" + i.ToString();
tb.Attributes.Add("onfocus", "HookUpControl(this,'" + CustomValidator1.ClientID + "')");
Page.Form.Controls.Add(tb);
}
and I have Hookup
HookUpControl like:
function HookUpControl(curObj,validatorClientID)
{
var validationControl = document.getElementById(validatorClientID);
validationControl.controltovalidate = curObj.id;
validationControl.clientvalidationfunction="validatetextbox";
validationControl.validateemptytext = "true";
ValidatorHookupControl(curObj, validationControl);
}
and I have client validation function as:
function validatetextbox(sender, args)
{
if(args.Value=="")
{
sender.errormessage="<b>Required Field Missing</b><br />This is required." ;
sender.innerHTML="<b>Required Field Missing</b><br />This is required." ;
args.IsValid = false;
return;
}
if(isNaN(args.Value))
{
sender.errormessage="<b>Invalid field</b><br />Only Numbers are alowed." ;
sender.innerHTML="<b>Invalid field</b><br />Only Numbers are alowed." ;
args.IsValid = false;
return;
}
if(Number(args.Value)< 1000)
{
sender.errormessage="<b>value can not be less than 1000</b><br />This is required." ;
sender.innerHTML="<b>value can not be less than 1000</b><br />This is required." ;
args.IsValid = false;
return;
}
}
Here in this trick, the main role is played by
ValidatorHookupControl(curObj, validationControl) which is responsible for attaching the validator to the control.
I hope this will help a lot to improve the performance of the page for all.
