<p>I am using contact form plugin for forms in my craft website. For avoiding page redirection, I followed ajax submit for the form, but it is not redirected to controller code.</p>

<p><strong>My form is as below:-</strong>   </p>

<pre><code>&lt;form method="post" action="" accept-charset="UTF-8" class="basic-form" id="contactForm"&gt;
       {{ csrfInput() }}
       &lt;input type="hidden" name="action" value="contact-form/send"&gt;
       &lt;div class="form-group"&gt;
              &lt;input type="text" class="text-field" id="text-630573652" name="firstName" value="" required="" placeholder="Name *" autocomplete="off"&gt;
       &lt;/div&gt;
      &lt;div class="layout-sm-12"&gt;
             &lt;button type="submit" class="btn white-btn-outline submit-btn"&gt;LET'S TALK&lt;i class="icon-long-arrow-bold-right"&gt;&lt;/i&gt;&lt;/button&gt;
                    &lt;/div&gt;
            &lt;/form&gt;
</code></pre>

<p><strong>My ajax script is as follows:-</strong></p>

<pre><code>$(function () {
        $('#contactForm').on('submit', function (e) {
        e.preventDefault();
        $.ajax({
            type: 'post',
            url: '/',
            data: $('#contactForm').serialize(),
            dataType: 'json',
            success: function (response) {
                 alert(response);
            }
        });

        });
});
</code></pre>

<p>For this I am getting error in console like 404 page not found. How to redirect to send controller index function using ajax request. As per other tutorials '/' is not working here.</p>

<p>Anyone please help...</p>

CC BY-SA 4.0
2019-11-07T19:02:13.600Z
If you read the docs: The only required fields are fromEmail and message. Everything else is optional. You have neither.
Christopher Dosin
CC BY-SA 4.0
2019-11-08T04:14:18.960Z
Thank you for the reply. I am asking for how we will redirect to controller url using ajax
Rakhi Vijayan
CC BY-SA 4.0
2019-11-11T16:52:43.877Z
Since you have **contact-form/send** as your hidden field for form action, have you tried using this for the AJAX url?
4midori
CC BY-SA 4.0
2019-11-11T17:11:28.543Z
Thank you. That works.
Rakhi Vijayan
<plugin-development><craft3><php><ajax><plugin-contactform>
Contact form plugin ajax submit URL not working
# Contact form plugin ajax submit URL not working

(Asked by: username_0 on 2019-11-07)

I am using contact form plugin for forms in my craft website. For avoiding page redirection, I followed ajax submit for the form, but it is not redirected to controller code.
My form is as below:- 

       {{ csrfInput() }}
       
       
              
       
      
             LET'S TALK
                    
            

My ajax script is as follows:-
$(function () {
        $('#contactForm').on('submit', function (e) {
        e.preventDefault();
        $.ajax({
            type: 'post',
            url: '/',
            data: $('#contactForm').serialize(),
            dataType: 'json',
            success: function (response) {
                 alert(response);
            }
        });

        });
});

For this I am getting error in console like 404 page not found. How to redirect to send controller index function using ajax request. As per other tutorials '/' is not working here.
Anyone please help...

**Tags:** plugin-development, craft3, php, ajax, plugin-contactform

> **Comments:**
> **username_1**: If you read the docs: The only required fields are fromEmail and message. Everything else is optional. You have neither.  
> **username_0**: Thank you for the reply. I am asking for how we will redirect to controller url using ajax  
> **username_2**: Since you have **contact-form/send** as your hidden field for form action, have you tried using this for the AJAX url?  
> **username_0**: Thank you. That works.  

---

## 0 answers

