CODEWITHSUNDEEP
javascriptphpjqueryajax
user5200241
user5200241

Reputation:

Sent data using AJAX but PHP outputs undefined_index

This has probably been answered already, but I can't seem to find a solution. I'm pretty sure I've been all over the internet.

I'm trying to send a mail from a form using AJAX. The AJAX script seems to be working fine. Here's the code:

$("#order").submit(function(e) {
    e.preventDefault();
    $(".loading-text").fadeIn("500");
    var title = $("input#title").val();
    var price = $("input#price").val();
    var name = $("input#name").val();
    var email = $("input#email").val();
    var phone = $("input#phone").val();
    var address = $("input#address").val();
    var urgency = $("input#urgency").val();

    $.ajax({
        url: "assets/order.php",
        type: "POST",
        dataType: "json",
        data: {
            title: title,
            price: price,
            name: name,
            email: email,
            phone: phone,
            address: address,
            urgency: urgency
        },
        cache: false,
        processData: false,

        success: function(data) {
        $(".loading-text").fadeOut("300");
        $(".success-text").fadeIn("500").append(data);
        },

        error: function(data) {
            $(".loading-text").fadeOut("300");
            $(".failure-text").fadeIn("500").append(data);
        }
    });
});

It returns undefined_index for all the variables however. Here's the PHP script:

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
 $name = htmlspecialchars($_POST['name']);
 $email = filter_var($_POST['email'], FILTER_SANITIZE_EMAIL);
 $title = htmlspecialchars($_POST['title']);
 $price = htmlspecialchars($_POST['price']);
 $phone = htmlspecialchars($_POST['phone']);
 $address = htmlspecialchars($_POST['address']);
 $urgency = htmlspecialchars($_POST['urgency']);
 $to1 = "[email protected]";
 $to2 = "[email protected]";
 $subject = "New order received!";

$msg_stalker = "Hello STALKER! New order received.\n\n"."Here are the details:\n"."Name: $name\n\nAddress: $address\n\nEmail: $email\n\nPhone number: $phone\n\nItem: $title\n\nPrice: $price\n\nThis customer needs their service/product in $urgency hours.";
$msg_owner = "Hello! Your store on STALKER! has a new order.\n\n"."Details:\n"."Item: $title\n\nPrice: $price\n\nThis customer needs their service/product in $urgency hours."."You may contact us on [email protected] if item is unavailable or for any other query.\n\nExpect us soon.\n\nWe've got your back! ;)";
$from = "Order form at (stores.neighbourhoodstalker.com)";

if (empty($name) || empty($address) || empty($phone)) {
    http_response_code(400);
    echo "Error! Please check that all required fields have been filled and try again.";
    exit;
}

if(mail($to1, $subject, $msg_stalker, 'From: '.$from) && mail($to2, $subject, $msg_owner, 'From: '.$from)) {
    http_response_code(200);
    echo "Order placed successfully.";
}
else {
    http_response_code(500);
    echo "Something went wrong. Check your internet connection and try again.";
}
}
else {
  http_response_code(403);
  echo "There was a problem with your submission. Please try again.";
 }
?>

I'm not sure where the problem is now because I used a similar code for a file uploader and it worked perfectly.

Upvotes: 1

Views: 41

Answers (2)

Alexey Soshin
Alexey Soshin

Reputation: 17701

You're using wrong dataType. Use dataType: "json".

http://api.jquery.com/jquery.ajax/

Upvotes: 0

Rajdeep Paul
Rajdeep Paul

Reputation: 16963

The problem is because of this setting in AJAX,

processData: false,

From the documentation,

processData (default: true)

Type: Boolean

By default, data passed in to the data option as an object (technically, anything other than a string) will be processed and transformed into a query string, fitting to the default content-type "application/x-www-form-urlencoded". If you want to send a DOMDocument, or other non-processed data, set this option to false.

Since you're not sending any DOMDocument or non-processed data, remove this setting processData: false from your AJAX request.

Upvotes: 1

Related Questions