Validations In asp.net With Text focus Using Jquery

Step1:- Validations on jquery
$(document).ready(function () {
            $("#btnSave").click(function () {
                var firstName = $("#txtFirstName").val();
                var lastName = $("#txtLastName").val();
                var Email = $("#txtEmail").val();
                var password = $("#txtPassword").val();
                var confirmPassword = $("#txtConfirmPassword").val();
                var Gender = $("#ddlGender option:selected").text();
                if (firstName == "" && lastName == "" && Email == "" && password == "" &&        confirmPassword == "" && Gender == "Select Gender")
                {
                    $("#txtFirstName").css("border-color", "red");
                    $("#txtLastName").css("border-color", "red");
                    $("#txtEmail").css("border-color", "red");
                    $("#txtPassword").css("border-color", "red");
                    $("#txtConfirmPassword").css("border-color", "red");
                    $("#ddlGender").css("border-color", "red");
                    return false;
                }
            });
        });

Step2:-Source code
<table align="center">
                <tr>
                    <td>First Name</td>
                    <td>
                        <asp:TextBox ID="txtFirstName" runat="server"></asp:TextBox></td>
                </tr>
                <tr>
                    <td>Last Name</td>
                    <td>
                        <asp:TextBox ID="txtLastName" runat="server"></asp:TextBox></td>
                </tr>
                <tr>
                    <td>Email</td>
                    <td>
                        <asp:TextBox ID="txtEmail" runat="server" TextMode="Email"></asp:TextBox></td>
                </tr>
                <tr>
                    <td>Password</td>
                    <td>
                        <asp:TextBox ID="txtPassword" runat="server" TextMode="Password"></asp:TextBox>
                    </td>
                </tr>
                <tr>
                    <td>Confirm Password</td>
                    <td>
                        <asp:TextBox ID="txtConfirmPassword" runat="server" TextMode="Password"></asp:TextBox></td>
                </tr>
                <tr>
                    <td>Gender</td>
                    <td>
                        <asp:DropDownList runat="server" ID="ddlGender">
                            <asp:ListItem Text="Select Gender" Value="0"></asp:ListItem>
                            <asp:ListItem Text="Male" Value="1"></asp:ListItem>
                            <asp:ListItem Text="Female" Value="2"></asp:ListItem>
                        </asp:DropDownList>
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td>
                        <asp:Button runat="server" ID="btnSave" Text="Save" />
                    </td>
                </tr>
            </table>
Output:-

No comments:

Post a Comment