Custom validator with Client side and Server side Validation

Monday, April 30, 2012

Custom validator with Client side and Server side Validation

The simple Example of Custom validator with Client side validation is shown as below.The Example is about the From Year should be Less than the To Year.

Client side

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
   <title></title>
   <script type="text/javascript" language="javascript">
   function CustomValidate(sender, args) {
   if (document.getElementById('ddlfromyear').selectedIndex > document.getElementById('ddltoyear').selectedIndex) {
   args.IsValid = false;
   }
   else {
   args.IsValid = true;
   }
   }

   </script>
</head>
<body>
   <form id="form1" runat="server" >
   <div>
   From:
   <asp:DropDownList ID="ddlfromyear" runat="server" ValidationGroup="aa"></asp:DropDownList>

   To:
   <asp:DropDownList ID="ddltoyear" runat="server" ValidationGroup="aa"></asp:DropDownList>

   <asp:CustomValidator ID="custvaddropdown" runat="server" ValidationGroup="aa" ClientValidationFunction="CustomValidate" ControlToValidate="ddlfromyear" ErrorMessage="From Year should be Less than the To Year." Text="From Year should be Less than the To Year."></asp:CustomValidator>
   <asp:Button ID="btntest" runat="server" Text="Test" ValidationGroup="aa" />

   </div>
   </form>
</body>
</html>

.aspx.cs Page code

protected void Page_Load(object sender, EventArgs e)

{

BindDropDown();

}

private void BindDropDown()

{

for (int i = 1990; i < 2012; i++)

{

ddlfromyear.Items.Add(i.ToString());

ddltoyear.Items.Add(i.ToString());

}

The custom validation for server side :

I am showing you how to use custom validator with server side validation...
The Practical that i am showing you is about the textbox length should be eight character or more than that.if its length is less than 8 character then it will shown an error on Page.

.aspx Page

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
   <title>Custom validator with ServerSide</title>
</head>
<body>
   <form id="form1" runat="server">
   <div>
   <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
   <asp:CustomValidator ID="CustomValidator1" runat="server" OnServerValidate="TextValidate"
   ControlToValidate="TextBox1" ErrorMessage="Text must be 8 or more characters.">
   </asp:CustomValidator><br />
   <asp:Button ID="btnClick" runat="server" Text="Check" OnClick="btnClick_Click" />
   </div>
   </form>
</body>
</html>

.aspx.cs Page

namespace CustomValidator
{
   public partial class ServerSideCustomValidator : System.Web.UI.Page
   {
   protected void Page_Load(object sender, EventArgs e)
   {

   }
   protected void TextValidate(object source, ServerValidateEventArgs args)
   {
   if (args.Value.Length >= 8)
   {
   args.IsValid = true;
   }
   else
   {
   args.IsValid = false;
   }

   }

   protected void btnClick_Click(object sender, EventArgs e)
   {
   if (Page.IsValid)
   {
   Response.Redirect("~/ClientSideCustomValidator.aspx");
   }
   }
   }
}

Download sample from here......