How to submit contact form 7 without page refresh in wordpress?

Question

Hi I'm pretty new to contact form 7. I've seen on Youtube tutorials, that contact form 7 submits without page refresh. But when I install the plugin it's working with a page refresh.

Please advise on how to enable it to work without page refresh. Thanks.

Navarino

Please put the code here. – Sortilege

Answer 1

I found the fault, the issue was i haven't included the wp_head() and wp_footer() functions in my theme.

There's a page in contactform7 site on this:

https://contactform7.com/why-isnt-my-ajax-contact-form-working-correctly/

there they have mentioned the requirements for ajax to work.

Navarino

I had forgotten to add wp_footer() in footer.php and that was the issue. Thanks for your answer. – Counterblow

Answer 2

Add wp_head() funtion in your header.php file and wp_footer() function in footer.php file.

That's it solved :)

Spiritoso

Answer 3

My problem was solved by changing the jquery used. Check the version you are using.

<script
  src="https://code.jquery.com/jquery-2.2.4.min.js"
  integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
  crossorigin="anonymous">
enter code here
</script>

Doubletongued

I was using the jQuery slim version. I just changed to the non-slim and it worked. Thank you. – Heartsease

Answer 4

I have recently experienced this problem. I have opening a form inside popup and submit would refresh it.

So, after some much hair pulling I happened to view source and there I noticed some part of footer code wasn't highlighted. Why? turns out it was my silly mistake. I forgot to close one iframe tag. Once I closed it. view source code was perfectly highlighted and the problem was resolved.

Katlaps

Answer 5

After verifying that one of the main reasons why the page refreshes when submitting the form are:

1. JavaScript file is not loaded: If you are using themes downloaded from the store, usually the problem is with page optimizers like Lite Speed Cache. Otherwise check that your themes are loading the Ajax file correctly.

This was my case, the Js files were loading in delay, I was using a Page Cache which was speeding up the web page but not loading the javascript files correctly.

2. Conflicts with other JavaScript

3. HTML structure is not valid

Hertfordshire