Question

I have a .net 4 asp.net website. There is a listview with a checkbox in each “cell” of the listview. I’d like to attach some javascript to these checkboxes in that when the check box is checked/unchecked, it changes the color of teh asp:tablecell. The listview is bound to a collection.

I don’t want to do a postback on each check change as there may be quite a few checkboxes changed.

Am i taking the wrong approach or would javascript be a good approach and if so, can someone help with the javascript.
thanks

Answer 1

I do this in the ItemDataBound event of the ListView. Say you have the following javascript function:

function changeClass(checkBoxId, containerId) {
    var checkBox = document.getElementById(checkBoxId);
    var container = document.getElementById(containerId);
    if(checkBox.checked == true) container.style.backgroundColor = "#AAA";
    else  container.style.backgroundColor = "#FFF";
}

Then, you can use FindControl in ItemDataBound like so:

protected void ListView1_ItemDataBound(object sender, EventArgs e)
{
    var checkBox = e.Item.FindControl("nameOfCheckBox");
    var container = e.Item.FindControl("nameOfTableCell");

    checkBox.Attributes["onclick"] = "javascript:changeClass('"
        + checkBox.ClientID + "','"
        + container.ClientID + "');";
}