Click here to Skip to main content
15,897,718 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
adding css class in jquery to checkboxes in asp.net

$(document).ready(function(){
$('input[type="checkbox"]').each(function ()
{$(this).addClass("c1")
});
});


I have wrote the above code which was not applying css


Posted
Updated 22-Mar-13 21:41pm
v2

1 solution

Hello Surendra,

Here is a small html prototype demonstrating that your code should work.
HTML
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.c1 { padding: 2px 20px 2px 20px; }
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('input[type="checkbox"]').each(function () {
        $(this).addClass("c1");
    });
});
</script>
</head>
<body>
<form name="frmMain" id="frmMain" method="post">
<label>Check 1</label><input type="checkbox" id="chk1" name="chk1"/><span>One</span></br>
<label>Check 2</label><input type="checkbox" id="chk2" name="chk2"/><span>Two</span></br>
</form>
</body>
</html>


What do you mean by not working? May be you don't have proper reference to JQuery script or rule C! itself does not exists or it does not have an attribute which indicate so visually.

Regards,
 
Share this answer
 
Comments
surendranew 23-Mar-13 6:45am    
Hi Prasad It may work for html controls i'm asking for asp.net checkboxes and checkboxlist i gave the correct reference
Prasad Khandekar 23-Mar-13 6:54am    
ASP.NET textbox and checkbox controls when gets rendered will out put similar HTML as shown in the above example. The style changed script gets executed on the client side in browser and that when browser has finished loading the HTML. So just ensure that your ASP.NET page includes a script tag for JQuery similar to one shown in example, and your style sheet file has a css rule named C1.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900