Use cssclass for checkbox borders, border colors etc
& check for the classname in javascript as placed in the below code,
i have tested the below code & its working as per your requirement,
verify and comment.
<head runat="server">
<title>Untitled Page</title>
<style>
.TestClass1
{
border: 2px solid red;
padding-top: 4px;
}
.TestClass2
{
/*
border: 2px solid black;
padding-top: 4px;
*/
}
</style>
<script type="text/javascript">
function chkclick(obj) {
var num1 = obj.id;
if (num1 != "") {
if (document.getElementById(num1).checked || (document.getElementById(num1).checked == false)) {
document.getElementById(num1).checked = false;
if (document.getElementById(num1.replace("chkV", "chk830")).parentElement.className == "TestClass1") {
document.getElementById(num1.replace("chkV", "chk830")).parentElement.className = "TestClass2";
document.getElementById(num1.replace("chkV", "chk830")).checked = false;
}
else {
document.getElementById(num1.replace("chkV", "chk830")).parentElement.className = "TestClass1";
document.getElementById(num1.replace("chkV", "chk830")).checked = true;
}
}
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="GridView1" runat="server" OnRowDataBound="GridView1_RowDataBound">
<Columns>
<asp:TemplateField >
<ItemTemplate>
<asp:CheckBox ID="chkV" runat="server" onclick="chkclick(this)" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField >
<ItemTemplate>
<asp:CheckBox ID="chk830" runat="server" onclick="chkclick(this)" Checked="true" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</form>
</body>
Change the OnRowDataBound
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
CheckBox control2 = e.Row.FindControl("chk830") as CheckBox;
if (null != control2)
{
if (control2.Checked)
{
control2.Attributes.Add("class", "TestClass1");
}
}
}
}