Change Color With Checkbox

[ShoeLace1291]

Ok, so I'm writing a script that deletes a row from a database.  It uses a checkbox to determine if that row is to be deleted.  What I want to do is make the appropriate area red if the checkbox is selected.

 

I figured out how to change the color when it's selected, but not how to change it when it's unselected.

 

This is what I have so far:

<div id='{MEMBER_ID}'>
<input type='checkbox' name='delete' id='delete' value='{MEMBER_ID}' onclick="document.getElementById('{MEMBER_ID}').style.background = 'red';">
</div>

 

So is there an onselect/onunselect event that I could use?  I don't want to have to write seperate file for this.

[Adam]

Not sure how you solved this exactly, but you're better off using a toggle function type solution:

 

function toggleDelete(obj, el) {
    if (obj.checked == true) {
        document.getElementById(el).style.backgroundColor = 'red';
    } else {
        document.getElementById(el).style.backgroundColor = 'transparent';
    }
}

 

You can call it like:

 

<div id="member">
    <input type="checkbox" onchange="toggleDelete(this, 'member');" style="padding: />
</div>

[Psycho]

Not sure how you solved this exactly, but you're better off using a toggle function type solution:

 

function toggleDelete(obj, el) {
    if (obj.checked == true) {
        document.getElementById(el).style.backgroundColor = 'red';
    } else {
        document.getElementById(el).style.backgroundColor = 'transparent';
    }
}

 

Or, use the ternary operator

function toggleDelete(obj, el)
{
    document.getElementById(el).style.backgroundColor = (obj.checked) ? 'red' : 'transparent';
}