Databases
StackOverflow2013
Postsdbo
PORemoving classes of children
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PORemoving classes of children
    primarykey
    data
    text
    <p>I would like to remove several class attributes from several child nodes under a dynamically created jQuery Accordion. I am having trouble getting my jQuery to function. This is what I have so far.</p> <pre><code>&lt;cfset index = 1&gt; &lt;cfloop query="qApp"&gt; &lt;h3 id="header_#index#"&gt;#ApplianceType#&lt;/h3&gt; &lt;div id="header_#index#"&gt; &lt;p&gt; &lt;!---- Serial Number ---&gt; &lt;div class="ctrlHolder invalid error" id="serial_#index#"&gt;&lt;label&gt;Serial Number&lt;/label&gt; &lt;cfinput type="text" name="app_#ApplianceTypeID#_ser" data-default-value="Enter Serial Number or Value" size="35" class="textInput required invalid error" id="serialinput_#index#" value="" /&gt; &lt;cfinput name="app_#ApplianceTypeID#_IDd" type="hidden" value="" /&gt; &lt;p class="formHint"&gt;field is required&lt;/p&gt; &lt;/div&gt; &lt;!--- Appliance ---&gt; &lt;div class="ctrlHolder invalid error" appl_#index#&gt;&lt;label&gt;Appliance&lt;/label&gt; &lt;cfinput name="app_#ApplianceTypeID#_app" data-default-value="Appliance" class="textInput required invalid error" id="applinput_#index#" value=""&gt; &lt;p class="formHint"&gt;Appliance is required&lt;/p&gt; &lt;/div&gt; &lt;!--- active ---&gt; &lt;div class="ctrlHolder" id="color_select"&gt; &lt;ul&gt; &lt;li&gt; &lt;label for="agreement"&gt; &lt;input type="checkbox" id="checkbox2_#index#" name="app_#ApplianceTypeID#_chk" style="width:50px"&gt; active &lt;/label&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/p&gt; &lt;/div&gt; &lt;cfset index = index + 1&gt; &lt;/cfloop&gt; &lt;script&gt; $('[id^=serial_]').each(function(){ $("#checkbox2_"+ id).change(function(){ if($(this).is(":checked")) { //separate id2 and checkbox sep_selid2 = this.id.split("_"); //separate id selid2 = sep_selid2[1]; $('H3#header_' + selid2).children().addClass("required"); } else { //separate id2 and checkbox sep_selid2 = this.id.split("_"); //separate id selid2 = sep_selid2[1]; $('div#header_' + selid2).children().removeClass("required"); $('div#header_' + selid2).children().removeClass("invalid"); $('div#header_' + selid2).children().removeClass("error"); } }); }); &lt;/script&gt; </code></pre> <p>So the desired functionality is when the user checks the "active" checkbox, the input fields have "required" added to the class. When the user unchecks the "active" checkbox "requried" , "error", and "invalid" are removed. Please let me know if I confused you and ask any questions. Thanks!</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USChris Pilie
    1. USChris Pilie
    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.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. COThere are no children in the `<h3>` element
      singulars
      1. PORemoving classes of children
      1. USnbrooks
    2. COThis is off-topic, but I think worth pointing out anyway. If you're looping over a ColdFusion query, you don't have to create an 'index' variable that you +1 to within your loop. You can simply use `qApp.currentRow` instead, which does exactly the same thing.
      singulars
      1. PORemoving classes of children
      1. USduncan
    3. COI suggest putting the loop aside for a moment. Get your jquery to work on a single set of html elements first.
      singulars
      1. PORemoving classes of children
      1. USDan Bracuk
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

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