Contact Form 7
AJAX in dynamically displayed forms (1 post)

  1. kodomo00
    Posted 3 years ago #

    I need to generate (display rather) a wpcf7 form dynamically, here's a quick example:

    <div id="contactForm">the form will be displayed here</div>
    <input type="button" onclick="displayForm()" value="Display Form">
    <script type="text/javascript">
    	function displayForm() {
    		var formContent = '<?php echo str_replace(array("\r\n", "\n", "\r"), '', do_shortcode('[contact-form-3 id="13" title="Contact Us"]')); ?>';
    		document.getElementById('contactForm').innerHTML = formContent;

    The problem is that AJAX doesn't work in this generated form (there is another form on the same page (in fact the same one) and it works fine).

    wpcf7 docs say that the most probable reason of AJAX not working is the malfunction of wpcf7 javascript, but we know that it's fine because the other form works.

    I assume that the generated form doesn't recognise the JS, it probably has something to do with the order they are parsed or something. I'm still a baby in terms of these mechanics, so if someone could shed some light on what is actually happening and what's the possible workaround, that'd be great!



Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Contact Form 7
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic