In
this article i am going to explain how to validate CheckBoxList control using
jQuery in asp.net.
In
this example i have added static items in the CheckBoxList control. You can
also Bind CheckBoxList with the dynamic
data.
We can
validate checkboxlist by using server side code but it is slow as compare to
jQuery. Jquery is best option to validate input control because it is fast and
we can create attractive message popup for error message.
Steps to Follow:
Steps to Follow:
In the
<HEAD> Section of the design page write the following
<title>Validate Asp.Net CheckBoxList using jQuery</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>
<script type="text/javascript" language="javascript">
$(document).ready(function () {
$('#btnSubmit').click(function () {
if ($('#cblCourses input:checked').length > 0) {
return true;
}
else {
alert('Please select at least one subject)
return false;
}
})
});
</script>
<noscript> <h3 style="color: #FF3300;">
Javascript is not currently
enabled in your browser.<br /> You must <ahref="http://support.google.com/bin/answer.py?hl=en&answer=23852" target="_blank">enable Javascript</a> to run this web page correctly.
</h3></noscript>
In the <BODY> Section of the design page (.aspx) place a
CheckBoxList control, a Button and a Label control. Add some items in the
CheckBoxList control as:
<fieldset style="width:400px">
<legend><strong>Select
your Subjects</strong></legend>
<asp:CheckBoxList ID="cblCourses" runat="server" RepeatColumns="3">
<asp:ListItem>Maths </asp:ListItem>
<asp:ListItem>Data
Structure </asp:ListItem>
<asp:ListItem>C++</asp:ListItem>
<asp:ListItem>Database</asp:ListItem>
<asp:ListItem>ASP.NET</asp:ListItem>
<asp:ListItem>Computer
Network </asp:ListItem>
</asp:CheckBoxList>
<br />
<asp:Button ID="btnSubmit" runat="server" Text="Submit"
onclick="btnSubmit_Click" />
<asp:Label ID="lblStatus" runat="server" Text="" ForeColor="Green"></asp:Label>
</fieldset>
</center>
</form>
</body>
</html>
Asp.Net C# Code example
to validate CheckBoxList using jQuery
- In the code behind file (default.aspx.cs) write the following
code on Button’s click event as:
protected void btnSubmit_Click(object sender, EventArgs e)
{
lblStatus.Text = "Validation
Successfully Passed";
}
Asp.Net VB Code example
to validate CheckBoxList using jQuery
- Design the form same as above in the C#.Net section but
replace the line <asp:Button ID="btnSubmit"runat="server" Text="Submit" OnClick="btnSubmit_Click" /> with the line <asp:ButtonID="btnSubmit" runat="server" Text="Submit" />
- In the code behind file (default.aspx.vb) write the following
code on Button’s click event as:
Protected Sub btnSubmit_Click(sender As Object, e As System.EventArgs) Handles btnSubmit.Click
lblStatus.Text = "Validation
Successfully Passed"
End Sub
I have
used <noscript> tag in the <Head> section. This is useful in the
case if the JavaScript is disabled on the browser running the website.
This code
will execute when javascript is disable on your browser.
Now run the application and click on submit button without
selecting any subject, it will show the alert message “Please
select at least one subject ”. If you select any skill then
it will show the "validation Successfully Passed" message.
0 comments:
Post a Comment