Quantcast
Channel: WordPress.org Forums » All Posts
Viewing all articles
Browse latest Browse all 119818

HermanBos on "[Plugin: Contact Form 7] This is how to show/hide fields with jQuery"

$
0
0

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>

Viewing all articles
Browse latest Browse all 119818

Trending Articles