Note that there are some explanatory texts on larger screens.

plurals
  1. POSimple show / hide with a condition in jQuery
    primarykey
    data
    text
    <p>If want to show / hide fields based on a checkbox selection. Altough I am extremely new to jQuery, i thought this would be easy. Nevertheless, what it does, is it shows fields and directly hides them again. I tried if else and the code below. What am I doing wrong?</p> <pre><code>&lt;script language="javascript" type="application/javascript"&gt; $(document).ready(function() { $(".objectkenmerken&lt;?php echo $j.$i; ?&gt;").change(function() { var itemValue = $(this).children(':selected').val(); if(itemValue == "J") { $(".objectkenmerkent&lt;?php echo $j.$i; ?&gt;").show(); // Subvelden openen en sluiten $(".objectkenmerkent&lt;?php echo $j.$i; ?&gt;").click(function() { var itemValue2 = $(this).val(); $(".bouwjaar&lt;?php echo $j.$i; ?&gt;").hide(); $(".inhoud&lt;?php echo $j.$i; ?&gt;").hide(); $(".bijgebouwen&lt;?php echo $j.$i; ?&gt;").hide(); $(".objectafbakening&lt;?php echo $j.$i; ?&gt;").hide(); if(itemValue2 == 'Bouwjaar is niet correct') { $(".bouwjaar&lt;?php echo $j.$i; ?&gt;").show(); } if(itemValue2 == 'Inhoud is niet correct') { $(".inhoud&lt;?php echo $j.$i; ?&gt;").show(); } if(itemValue2 == 'Onjuiste bijgebouwen') { $(".bijgebouwen&lt;?php echo $j.$i; ?&gt;").show(); } if(itemValue2 == 'objectafbakening') { $(".objectafbakening&lt;?php echo $j.$i; ?&gt;").show(); } }); } else { $(".objectkenmerkent&lt;?php echo $j.$i; ?&gt;").hide(); } }); }); &lt;/script&gt; </code></pre> <p><strong>HTML (partially)</strong></p> <pre><code>&lt;select name="objectkenmerken00" class="objectkenmerken00"&gt; &lt;option selected&gt;&lt;/option&gt; &lt;option value="J"&gt;Ja&lt;/option&gt; &lt;option value="N"&gt;Nee&lt;/option&gt; &lt;/select&gt; &lt;div class="objectkenmerkent00" style="display:none;"&gt; &lt;input name="objectkenmerkent00[]" type="checkbox" value="Bouwjaar is niet correct" class="objectkenmerkent00" /&gt;Bouwjaar is niet correct Wat is volgens u het juiste bouwjaar? &lt;input name="bouwjaar00" class="bouwjaar00" type="text" style="display:none;" /&gt;&lt;br /&gt; &lt;input name="objectkenmerkent00[]" type="checkbox" value="Inhoud is niet correct" class="objectkenmerkent00"/&gt;Inhoud is niet correct Wat is volgens u de juiste inhoud? &lt;input name="inhoud00" class="inhoud00" type="text"style="display:none;" /&gt;&lt;br /&gt; &lt;input name="objectkenmerkent00[]" type="checkbox" value="Onjuiste bijgebouwen" class="objectkenmerkent00" /&gt;Onjuiste bijgebouwen Welke bijgebouwen zijn volgens u onjuist? &lt;input name="bijgebouwen00" class="bijgebouwen00" type="text" style="display:none;" /&gt;&lt;br /&gt; &lt;input name="objectkenmerkent00[]" type="checkbox" value="objectafbakening" class="objectkenmerkent00" /&gt;Onjuiste objectafbakening Wat is er volgens u onjuist afgebakend? &lt;input name="afbakening00" class="objectafbakening00" type="text" style="display:none;" /&gt;&lt;br /&gt; &lt;/div&gt; </code></pre> <p>When objectkenmerken00 is 'J' the checkboxes should be shown. If a certain checkbox is checked, then the field next to it should be shown.</p>
    singulars
    1. This table or related slice is empty.
    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