Saturday, 3 December 2011

jQuery Validations in asp.net sample code


Html Code:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="JqueryValidationSample.aspx.cs" Inherits="JqueryValidationSample" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>jQuery Validation Sample Page</title>
    <link rel="stylesheet" href="css/validationEngine.jquery.css" type="text/css" />
    <script src="js/jquery-1.5.1.min.js" type="text/javascript"></script>
    <script src="js/languages/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script>
    <script language="javascript" type="text/javascript">
    jQuery(document).ready(function(){
        jQuery("#frmRegistration").validationEngine('attach', {promptPosition : "centerRight"});
    });
    function ValidatePage()
    {
        jQuery('#frmRegistration').validationEngine('validate');
        if(jQuery('#frmRegistration').validationEngine('validate')==true)
        {
            document.getElementById('imgProcess').style.display='block';
            return true;
        }
        else
            return false;
    }
    </script>
</head>
<body>
    <div id="imgProcess" runat="server" style="display:none;position:absolute;z-index:999;padding:184px 100px 150px 30px;background:black;opacity:0.4;">
        <img alt="" src="Assets_ThickBox/loadingAnimation.gif" /></div>
    <h2>Registration</h2>
<form id="frmRegistration" runat="server">
   <p>
   <label>Email:</label>
   <asp:TextBox  id="txt_Email" runat="server" class="validate[required,custom[email]] text-input"></asp:TextBox>
   </p>
   <p>
   <label>Full Name:</label>
   <asp:TextBox id="txt_FullName" runat="server" ></asp:TextBox>
   </p>
   <p>
   <label>Username:</label>
   <asp:TextBox  id="txt_username"  runat="server" class="validate[required]" ></asp:TextBox>
   </p>
   <p>
   <label>Password:</label>
   <asp:TextBox  id="txt_Password"  runat="server" TextMode="Password" class="validate[required]" ></asp:TextBox>
   </p>
   <p>
   <label>Confirm Password:</label>
   <asp:TextBox  id="txt_Password0"  runat="server" TextMode="Password"
       class="validate[required,equals[txt_Password]]"></asp:TextBox>
   </p>
   <p>
   <label></label>
   <asp:CheckBox ID="chkagree" runat="server" />I agree to
   <a href="#" target="_blank" >terms and condition</a>
   </p>
       <asp:Button ID="btnJoin" runat="server" Text="Register"
                OnClientClick="javascript:return ValidatePage();" OnClick="btnJoin_Click" />
</form>
</body>
</html>


aspx.cs code:

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;

public partial class JqueryValidationSample : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            imgProcess.Style.Add("display", "none");
        }
    }
    protected void btnJoin_Click(object sender, EventArgs e)
    {
        //do your task
        imgProcess.Style.Add("display", "none");
    }
}

o/p:




Tag: Asp.net, c#, controls, csharp, development, dotnet, javascript, jquery, validation, vb

No comments:

Post a Comment

Parsing JSON w/ @ symbol in it

To read the json response like bellow @ concatenated with attribute                             '{ "@id": 1001, "@name&q...