SO - 29090511

by Arun P Johny

HTML

<table border="1">
    <tr>
        <td>System Setting</td>
        <td>(View Action)</td>
        <td>(Add Action)</td>
        <td>(Update Action)</td>
        <td>(Delete Action)</td>
    </tr>
    <tr>
        <td>1. Manage Main Module</td>
        <td>
            <input type="checkbox">
        </td>
        <td>
            <input type="checkbox">
        </td>
        <td>
            <input type="checkbox">
        </td>
        <td>
            <input type="checkbox">
        </td>
    </tr>
    <tr>
        <td>2. Manage Sub Module</td>
        <td>
            <input type="checkbox">
        </td>
        <td>
            <input type="checkbox">
        </td>
        <td>
            <input type="checkbox">
        </td>
        <td>
            <input type="checkbox">
        </td>
        <tr>
            <td colspan="5" align="right">
                <input type="checkbox">
            </td>
        </tr>
    </tr>
</table>
<table border="1">
    <tr>
        <td>Manage Setting</td>
        <td>(View Action)</td>
        <td>(Add Action)</td>
        <td>(Update Action)</td>
        <td>(Delete Action)</td>
    </tr>
    <tr>
        <td>1. Manage Setting</td>
        <td>
            <input type="checkbox">
        </td>
        <td>
            <input type="checkbox">
        </td>
        <td>
            <input type="checkbox">
        </td>
        <td>
            <input type="checkbox">
        </td>
        <tr>
            <td colspan="5" align="right">
                <input type="checkbox">
            </td>
        </tr>
    </tr>
</table>
            
            More and More tables.......

JavaScript

//change event handler for the checkbox in the last tr 
$('table tr:last-child input:checkbox').change(function(){
    //use closest to find the table containing the changed checkbox and set the checked value for each checkbox in that table to the new status
    $(this).closest('table').find('input:checkbox').prop('checked', this.checked)
})