Switch Div Class in Repeater based on Checkbox.Checked Using C#

Question

I have a repeater that will present a set of titles and checkboxes (some checked some not). Each is wrapped in a div with a background colour. All I want to do is change the background colour for the checkboxes that are already checked so they are easily identified on the page.

Here's the repeater:

<asp:Repeater ID="rptCartridges" runat="server" OnItemDataBound="rp_ItemDataBound">
     <ItemTemplate>
          <div class="cartridgebox">
               <span class="cartridgeboxl"><%#Eval("cartName") %></span> 
               <span class="cartridgeboxr">
                    <asp:CheckBox ID="chkCart" name="chkbox" Checked = '<%#Convert.ToBoolean(DataBinder.Eval(Container.DataItem, "cartChecked"))%>' runat="server" />
                <asp:HiddenField ID="hfCartID" runat="server" Value='<%#DataBinder.Eval(Container.DataItem, "cartID")%>' />
               </span>
          </div>
     </ItemTemplate>
</asp:Repeater>

All I really want to do is change the class cartridgebox to cartridgeboxchecked if the checkbox is returned as checked.

I have tried manipulating rp_ItemDataBound. Where it goes wrong is the actual changing of the class inline. I've tried using if statements, add runat="server" to the div and populating a variable and then using Response.Write inside the class statement. But nothing seems to work.

What seems the neatest way would be to use rp_ItemDataBound like so:

   protected void rp_ItemDataBound(object sender, RepeaterItemEventArgs e)
    {
        string chkboxClass = "cartridgebox";

        CheckBox chk = (CheckBox)e.Item.FindControl("chkCart");
        HiddenField hfCartID = (HiddenField)e.Item.FindControl("hfCartID");


        // Adding the hide.Value Attribute to the chk.Text field.
        chk.Attributes.Add("Text", hfCartID.Value);

        if (chk.Checked == true)
        {
            chkboxClass = "cartridgeboxchecked";
        }
        else
        {
            chkboxClass = "cartridgebox";
        }

    }

But I lack the understanding to pass the variable chkboxClass to the div's class dynamically. Of course I am probably looking at this completely wrong so any guidance would be appreciated.

Yuriy Rozhovetskiy Yuriy Rozhovetskiy · Accepted Answer · 2011-12-04T17:44:29

Use following markup for div in ItemTemplate : <div class='<%# ((bool)Eval("cartChecked"))? "cartridgeboxchecked" : "cartridgeboxl" %>' >

If you need to change div's class on checkbox change immediatelly, consider to add onclick client-side event handler to checkbox in ItemDataBound Repeater's event handler

Switch Div Class in Repeater based on Checkbox.Checked Using C#

1 Answers