I have multiple forms in same page with submit , i want to hide the form after form submit and display a link for the respective forms Below is the html i have the same class name for all the forms and for the submit class also.
<div id="wpcf7-f63-p1-o1">
<form name="" class="wpcf7-form" action="" method = "post">
<input type="text" name="your-name" value="" size="40" />
<input type="text" name="email" value="" size="40" />
<input type="submit" value="Send" class="but" />
</form>
</div>
<div id="wpcf7-f63-p1-o2">
<form name="" class="" action="" method = "post">
<input type="text" name="your-name" value="" size="40" />
<input type="text" name="email" value="" size="40" />
<input type="submit" value="Send" class="but" />
</form>
</div>
i tried the below code
<script>
jQuery(".wpcf7-form").submit(function()
{
jQuery("^wpcf7-f63-p1-").hide();
});
</script>';
In your example typed:
jQuery("^wpcf7-f63-p1-").hide();
i think should be:
jQuery("#wpcf7-f63-p1-o1").hide();
Use this on form submit
$('input[type="submit"]').click(function() {
$form = $(this).parent();
$('<p><a href="#">link to form</a></p>').insertBefore($form);
$form.hide();
});
Are you looking for jquery .find()
?
you could do something like this:
$('form').submit(function(){ $(this).find('.myForm').hide(); $(this).find('.link').show(); }
.link { display:none; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <form name="" class="" action="" method = "post"> <div class="myForm"> <input type="text" name="your-name" value="" size="40" /> <input type="text" name="email" value="" size="40" /> <input type="submit" value="Send" class="but" /> </div> <a class="link" href="#">Link</a> </form>
ah error on your jquery selector, change your js to:
jQuery(".wpcf7-form").submit(function()
{
jQuery("[id^='wpcf7-f63-p1-']").hide()
return false;
});
working jsfiddle code
NB. you may need to delete the return false
, I added it to see the elements getting disappeared after submit.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.