PHP not sending email from my website

Question

I've the following contact form in my website. But the form data is being appended onto the URL and the json is not being sent to the PHP mail handler. Below are my code for the form.

HTML

<form novalidate="novalidate" style="width:60%;margin-left:auto;margin-right:auto;" onsubmit="sendMailNew()">
<div class="col-md-12">
    <div class="col-md-6" style="padding-right: 5px">
                        <input type="text" class="form-control" name="contact_uname" id="contact_uname" placeholder="NAME" style="width:100%">
                    </div>
                    <div class="col-md-6">
                        <input type="text" class="form-control" name="contact_no" id="contact_no" placeholder="PHONE NUMBER" style="width:100%">
                    </div>

        <div class="col-md-12" style="margin-top: 3%">
            <input class="form-control" type="email" name="contact_email" id="contact_email" placeholder="E-MAIL ADDRESS" style="width:100%">
        </div>
        <div class="col-md-12" style="margin-top: 3%">
            <input type="text" class="form-control" name="contact_company" id="contact_company" placeholder="COMPANY" style="width:100%">
        </div>
        <div class="col-md-12" style="margin-top: 3%">
            <input type="text" class="form-control" name="contact_website" id="contact_website" placeholder="EXISTING WEBSITE(if any)" style="width:100%">
        </div>
        <div class="col-md-12" style="margin-top: 3%">
            <input type="text" class="form-control" name="contact_social" id="contact_social" placeholder="WHAT WOULD YOU LIKE(website, social media etc)" style="width:100%">
        </div>
        <div class="col-md-12" style="margin-top: 3%">
            <input type="text" class="form-control" name="contact_budget" id="contact_budget" placeholder="BUDGET(if we know approximately how much you're hoping to spend. we can (hopefully) come up with a strategy that fits your budget.)" style="width:100%">
        </div>
        <div class="col-md-12" style="margin-top: 3%">
            <input type="text" class="form-control" name="contact_section" id="contact_section" placeholder="WHAT SECTION WOULD YOU LIKE ON THE SITE" style="width:100%">
        </div>
        <div class="col-md-12" style="margin-top: 3%">
            <input type="text" class="form-control" name="contact_update" id="contact_update" placeholder="WHICH OF THOSE SECTIONS WILL YOU WANT TO BE ABLE TO UPDATE YOURSELF?" style="width:100%">
        </div>
        <div class="col-md-12" style="margin-top: 3%">
            <input type="text" class="form-control" name="contact_design" id="contact_design" placeholder="ANY IDEA ON THE STYLE OT DESIGN? DO YOU HAVE REFERENCES?" style="width:100%">
        </div>
        <div class="col-md-12" style="margin-top: 3%">
            <input type="text" class="form-control" name="contact_timeline" id="contact_timeline" placeholder="TIMELINE(when do you want to launch?)" style="width:100%">
        </div>
        <div class="col-md-12" style="margin-top: 3%">
            <input type="text" class="form-control" name="contact_hear" id="contact_hear" placeholder="HOW DID YOU HEAR ABOUT US?" style="width:100%">
        </div>
        <div class="col-md-12" style="margin-top: 3%">
            <input type="text" class="form-control" name="contact_comment" id="contact_comment" placeholder="ANY OTHER COMMENTS?" style="width:100%">
        </div>
        <div class="col-md-12" style="margin-top:3%">
                        <button type="submit" name="submit" value="submit" style="position:relative;left:45%;color:#22252c !important;background-color:white !important" class="btn btn-default">SUBMIT NOW</button>
                    </div>
    </div>
    </form>

AJAX script

<script type="text/javascript">
                function sendMailNew()
                {
                    $.ajax({
                    type: 'POST',
                    url: 'contactmail.php',
                    data: { cname: $("#contact_uname").val(), cno: $().val("#contact_no"), cemail: $("#contact_email").val(), ccompany: $("#contact_company").val(), cwebsite: $("#contact_website").val(), csocial: $("#contact_social").val(), cbudget: $("#contact_budget").val(), csection: $("#contact_section").val(), cupdate: $("#contact_update").val(), cdesign: $("#contact_design").val(), ctimeline: $("#contact_timeline").val(), chear: $("#contact_hear").val(), ccomment: $("#contact_comment").val() },
                    async: false,
                    success: function (data) {
                    $("#contact_uname").val()=data; 
                    $("#contact_no").val()="";
                    $("#contact_email").val()="";
                    $("#contact_company").val()="";
                    $("#contact_website").val()="";
                    $("#contact_social").val()="";
                    $("#contact_budget").val()="";
                    $("#contact_section").val()="";
                    $("#contact_update").val()="";
                    $("#contact_design").val()="";
                    $("#contact_timeline").val()="";
                    $("#contact_hear").val()="";
                    $("#contact_comment").val()="";
                    },                      
                    dataType: 'json',
                    error: function (e, g, y) {
                    var msg = e;
                    }
                    });
                    alert('Thanks for submitting the form, we will get back to you soon!');
                }          
            </script>

PHP mail handler

<?php 
    if(isset($_POST['submit'])){
    $to = "pavan@tip.agency";
    $from = $_POST['contact_email']; // this is the sender's Email address
    $name = $_POST['contact_uname'];
    $number = $_POST['contact_no'];
    $company = $_POST['contact_company'];
    $website = $_POST['contact_website'];
    $social = $_POST['contact_social'];
    $budget = $_POST['contact_budget'];
    $section = $_POST['contact_section'];
    $update = $_POST['contact_update'];
    $design = $_POST['contact_design'];
    $timeline = $_POST['contact_timeline'];
    $hear = $_POST['contact_hear'];
    $comment = $_POST['contact_comment'];
    $subject = "Form submission";
    $subject2 = "Copy of your form submission";
    $message = "Name:" . $name . "\n Email: " . $from . "\n Number:" . $number . "\n Company:" . $company . "\n Website:" . $website . "\n Social:" . $social . "\n Budget:" . $budget . "\n Section:" . $section . "\n Update:" . $update . "\n Design:" . $design . "\n Timeline:" . $timeline . "\n Hear:" . $hear . "\n Comment:" . $comment;
    $headers = "From:" . $from;
    mail($to,$subject,$message,$headers);
    }
?>

Any idea how to fix this?

Thanks in advance!!

If the page is reloading, show code of HTML and JS only. Make question more specific. — , Feb 14 '17 at 08:12
add an onclick attribute on your button. Remove the type submit from your button. Do this: sendMailNew(event). then in your function do this, event.preventDefault(); also try and do a console.log of your data variable in your ajax call to make sure you are actually parsing something — Rotimi, Feb 14 '17 at 08:18

score 0 · Answer 1 · answered Feb 14 '17 at 08:11

Stop default action in javascript first.

<script type="text/javascript">
 function sendMailNew()
  {
   event.preventDefault();
   //Your rest of JS here
  }
</script>

I'm not sure but you may need to add action="" to the form. Let us know if it solves.

Eskaaa · Answer 2 · 2017-02-14T08:25:56.267

the option is not type: 'POST', it is method: 'POST'. So by default it should be a GET request.

In your PHP Script, you take the values from "$_POST", so it can not find your parameters. Just try it this way. I prefer to use $.post, not $.ajax for my post requests. To make the script better, you should prevent default event and maybe use the url to submit your data as attribute action, and take it by $('form').attr('action') for your request.

$.ajax({
  method: "POST",
  url: "some.php",
  data: { name: "John", location: "Boston" }
})

I prefer this way, it looks just cleaner and you can not make a misstake with submit method:

function sendMailNew(e)
    {
        e.preventDefault();
        var $form = $('form');
        var url = $form.attr('action') || 'contactmail.php';

        var params = {
            cname: $("#contact_uname").val(),
            cno: $().val("#contact_no"),
            cemail: $("#contact_email").val(),
            ccompany: $("#contact_company").val(),
            cwebsite: $("#contact_website").val(),
            csocial: $("#contact_social").val(),
            cbudget: $("#contact_budget").val(),
            csection: $("#contact_section").val(),
            cupdate: $("#contact_update").val(),
            cdesign: $("#contact_design").val(),
            ctimeline: $("#contact_timeline").val(),
            chear: $("#contact_hear").val(),
            ccomment: $("#contact_comment").val()
        };

        $.post(url, params, function(data, status) {

            $("#contact_uname").val()=data; 
            $("#contact_no").val()="";
            $("#contact_email").val()="";
            $("#contact_company").val()="";
            $("#contact_website").val()="";
            $("#contact_social").val()="";
            $("#contact_budget").val()="";
            $("#contact_section").val()="";
            $("#contact_update").val()="";
            $("#contact_design").val()="";
            $("#contact_timeline").val()="";
            $("#contact_hear").val()="";
            $("#contact_comment").val()="";

        }, 'json').fail(function() {
            alert( "error" );
        });
    }

this is wrong. it is type post and not method post when making an ajax call. To fix this, prevent default action. event.preventDefault(); — Rotimi, Feb 14 '17 at 08:13
WHY ? Type is just a alias for method! We dont know wich jQuery version he use. Maybe he can show us some snippeds of the network requests in his debugging tool. http://api.jquery.com/jquery.ajax/ >>>> type (default: 'GET') Type: String An alias for method. You should use type if you're using versions of jQuery prior to 1.9.0. <<<< >>> method (default: 'GET') Type: String The HTTP method to use for the request (e.g. "POST", "GET", "PUT"). (version added: 1.9.0) << — Eskaaa, Feb 14 '17 at 08:29
Did you try my snipped? Wich browser do you use? Can you show us your request, when you press F12 you should have a debuggin tool, there you can see the XHR Request, in chrome i the network tab. You should find somethign like "Request URL:https://domain.tld Request Method:POST Status Code:200 Remote Address:999.999.999.999" — Eskaaa, Feb 14 '17 at 09:37

PHP not sending email from my website

2 Answers2