JQuery Check All & Enable Fields Not Working Together
<p>I have the following jQuery script that is used to manage a large treeview of inputs with the ability to enable/disable certain inputs. When a row is enabled, its textboxes should be enabled and vice versa.</p>

<p><strong>UPDATE (Working)</strong></p>

<p>This is my script:</p>

<pre><code>&lt;script type="text/javascript"&gt;
    $(document).ready(function () {
        $('#cb-master').click(toggleCheckAll);
        $('#mappings input:checkbox[id^="cb"]').click(checkChildren);
        $('#mappings tbody tr[id^="child"] input:checkbox').change(toggleInputs);
    });

    function toggleCheckAll() {
        var selector = $(this).is(':checked')
                           ? '#mappings tbody input:checkbox:checked'
                           : '#mappings tbody input:checkbox:not(:checked)';

        $(selector).each(function () {
            $(this).trigger('click');
        });
    }

    function checkChildren() {
        var selector = ".child-of-" + $(this).closest('tr').attr('id');
        var isChecked = $(this).is(':checked') ? ':not(:checked)' : ':checked';
        $(selector).find('input:checkbox' + isChecked).each(function () {
            $(this).trigger('click');
            $(this).change();
        });
    }    

    function toggleInputs() {
        var isChecked = $(this).attr('checked');
        var inputs = $(this).closest('tr').find('input:text');

        if (isChecked)
            inputs.removeAttr('disabled');
        else
            inputs.attr('disabled', 'disabled');
    }
&lt;/script&gt;
</code></pre>

<p>This is what my table looks like:</p>

<pre><code>&lt;table id="mappings"&gt;
    &lt;thead&gt;
        &lt;tr&gt;
            &lt;th&gt;&lt;input type="checkbox" id="cb-master"&gt;&lt;/th&gt;
            &lt;th&gt;Title&lt;/th&gt;
            &lt;th&gt;Input&lt;/th&gt;
        &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody&gt;
        &lt;tr id="grandparent"&gt;
            &lt;td&gt;&lt;input type="checkbox" id="cb-grandparent" /&gt;&lt;/td&gt;
            &lt;td&gt;Grandparent&lt;/td&gt;
            &lt;td /&gt;
        &lt;/tr&gt;
        &lt;tr id="parent" class="child-of-grandparent"&gt;
            &lt;td&gt;&lt;input type="checkbox" id="cb-parent" /&gt;&lt;/td&gt;
            &lt;td&gt;Parent&lt;/td&gt;
            &lt;td /&gt;
        &lt;/tr&gt;
        &lt;tr id="child-1" class="child-of-parent"&gt;
            &lt;td&gt;&lt;input type="checkbox" id="cb-child-1" /&gt;&lt;/td&gt;
            &lt;td&gt;Child 1&lt;/td&gt;
            &lt;td&gt;&lt;input type="text" /&gt;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr id="child-2" class="child-of-parent"&gt;
            &lt;td&gt;&lt;input type="checkbox" id="cb-child-2" /&gt;&lt;/td&gt;
            &lt;td&gt;Child 2&lt;/td&gt;
            &lt;td&gt;&lt;input type="text" /&gt;&lt;/td&gt;
        &lt;/tr&gt;
    &lt;/tbody&gt;
&lt;/table&gt;
</code></pre>

<p>This works when I manually check/uncheck each box, but it does not work when I do it programatically through the <code>toggleCheckAll()</code> function. Is there something I have to do to bind this event programitically as well?</p>

<p>Also, I am having difficulty implementing the <code>checkChildren</code> function recursively, as every time I attempt to I get the exception <code>nodeName is null or not an object</code>.</p>

<p>Any input is greatly appreciated. Thanks.</p>
