Note that there are some explanatory texts on larger screens.

plurals
  1. POexclude nested children
    primarykey
    data
    text
    <p>The following script enables/disables their nested form controls using a <code>for:x</code> class name. The problem is that nested <code>for:y</code> elements are being enabled when they shouldn't be. They should only be enabled when the nested <code>for:y</code> is enabled.</p> <p>Can someone provide me with an additional filter to exclude the form elements that are inside a nested <code>for:*</code> class?</p> <p>In other words, given the example below, when <code>losssold</code> is checked then all the child inputs of <code>for:losssold</code> should be enabled except for the child element elements inside <code>for:has-buy-sell-agreementtrue</code> if <code>has-buy-sell-agreementtrue</code> is not also checked. </p> <p>So I thought it would be easier to just figure to exclude those elements in <code>for:has-buy-sell-agreementtrue</code>.</p> <pre><code>&lt;script type="text/javascript"&gt; $('[class*="for:"]').each(function(){ var klass=$(this).attr('class'),element; var that = this; $.each(klass.split(' '),function(index,value){ if(!value)return; if (value.substr(0,4)=='for:') element=value.substr(4); }); $('[name="' + $('#'+element).attr('name') + '"]') .click(function(){ $(that).toggleClass('disabled', !$('#'+element).is(':checked')) .find('input,select,textarea') /* insert edge case here */ .each(function(){ if ($('#'+element).is(':checked')) $(this).removeAttr('disabled'); else $(this).attr('disabled','disabled'); }); }) .trigger('click'); }); &lt;/script&gt; &lt;li&gt;What would you like to see happen to your business when you (or a co-owner) die, become disabled, or retire? &lt;br/&gt; &lt;ul&gt;&lt;li&gt;&lt;label&gt;&lt;input type="radio" name="loss" id="losssold" value="sold"/&gt; Sold to other Owners/another Business&lt;/label&gt; &lt;ul class="for:losssold"&gt; &lt;li&gt;Do you have a buy-sell agreement?&lt;br/&gt; &lt;label&gt;&lt;input type="radio" name="has-buy-sell-agreement" id="has-buy-sell-agreementtrue" value="true"/&gt; Yes&lt;/label&gt; &lt;label&gt;&lt;input type="radio" name="has-buy-sell-agreement" id="has-buy-sell-agreementfalse" value="false"/&gt; No&lt;/label&gt;&lt;br/&gt; &lt;ol class="for:has-buy-sell-agreementtrue"&gt; &lt;!-- nested for class; inner elements shouldn't be affected --&gt; &lt;li&gt;&lt;label for="buy-sell-last-updated"&gt;When was the agreement last updated?&lt;/label&gt;&lt;br/&gt; &lt;input type="text" name="buy-sell-last-updated" id="buy-sell-last-updated" value=""/&gt; &lt;/li&gt; &lt;li&gt;Is the agreement funded?&lt;br/&gt; &lt;label&gt;&lt;input type="radio" name="buy-sell-is-funded" id="buy-sell-is-fundedtrue" value="true"/&gt; Yes&lt;/label&gt; &lt;label&gt;&lt;input type="radio" name="buy-sell-is-funded" id="buy-sell-is-fundedfalse" value="false"/&gt; No&lt;/label&gt; &lt;/li&gt; &lt;/ol&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload