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:-
$(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