Second hiding doesnot show up?
The first hidefunction operates perfect, I added e second hide function (and i am intending to create more hidefunctions). But the field doesnot show up?
See the jQuery code and the contactform code here below. What i am doing wrong?
[ Moderator Note: Please post code or markup snippets between backticks or use the code button. ]
/*! jQuery script to hide certain form fields */
$(document).ready(function() {
//Hide the field initially
$("#hide1").hide();
$("#hide2").hide();
$("#hide3").hide();
//First hidefunction: Laat de tekst zien, waneer resp "ik kom niet", "mijn partner komt niet" gekozen wordt.
$('#wieniet').change(function() {
if ($("#wieniet").val() == "ik kom niet") {
$("#hide1").show();
}
else {
$("#hide1").hide();
}
if ($("#wieniet").val() == "mijn partner komt niet") {
$("#hide2").show();
}
else {
$("#hide2").hide();
}
});
//Second hidefunction:Laat de tekst zien, waneer resp "graag informatie over mogelijke invaller", "ik zorg zelf voor een invaller" gekozen wordt.
$('#intinv').change(function() {
if ($("#intinv").val() == "ja") {
$("#hide3").show();
}
else {
$("#hide3").hide();
}
});
});
Contact Form 7 code:
<table>
<tr>
<td><label for="wieniet">Wie komt er niet?*</label></td>
<td>[select* wieniet 20 id:wieniet include_blank class:contactForm "ik kom niet" "mijn partner komt niet" "mijn partner en ik komen niet"]</td>
<tr>
<td><div class="hide" id="hide1">
<label for="telp">Telefoonnr. partner*</label>
[text* telp 11/11 id:telp class:contactForm]
<label for="intinv">Interesse om met invaller te spelen?*</label>
[select* intinv include_blank "ja" "nee"]
</div>
<div class="hide" id="hide2">
<label for="mtel">Mijn telefoonnr.*</label>
[text* mtel 11/11 id:mtel class:contactForm]
<label for="intinv">Interesse om met invaller te spelen?*</label>
[select* intinv include_blank "ja" "nee"]
</div>
</tr>
<tr>
<td>
<div class="hide" id="hide3">
<label for="zinv">Indien er interesse is om met een invaller te spelen:*</label>
[select* zinv id:intinv include_blank class:contactForm "graag informatie over mogelijke invaller" "ik zorg zelf voor een invaller"]
</div>
</td>
</table>