Question

I have a table which is generated from data from a datbase. It might have 3 rows and 2 cells.

Each cell has a checkbox in it and 2 hidden form fields.

So, a typical row might look like this:

<tr>
<td>
<input type="checkbox" id="Assign" onclick="setchanged(this);">
<input type="hidden" id="hfChanged" value="0">
<input type="hidden" id="hfAgentID value="272">
</td>
<td>
<input type="checkbox" id="Assign" onclick="setchanged(this);">
<input type="hidden" id="hfChanged" value="0">
<input type="hidden" id="hfAgentID value="324">
</td>
</tr>

The requirement is – when a checkbox is clicked, it should set the value of the hfChanged hidden field in the same cell to 1.

This works in Internet Explorer:

function setchanged(me)
{
me.parentElement.all("hfChanged").value = 1;
}

How can I set the value of hfChanged in Standards Compliant browsers like Firefox or Chrome?

Answer 1

You can use the following function to find out the next element as given in this answer

function next(elem) {
    do {
        elem = elem.nextSibling;
    } while (elem && elem.nodeType != 1);
    return elem;        
}

Working demo here.

Code:

function setchanged(me){
    next(me).value = me.checked == true ? 1 : 0;
}

function next(elem) {
    do {
        elem = elem.nextSibling;
    } while (elem && elem.nodeType != 1);
    return elem;        
}