Why does PHP not receive POST data sent via AJAX?

Question

I've seen this many times before on Stack Overflow and other websites, but none of the previous posts seem to be helping.

Assume the following HTML code:

<input maxlength="50" size="50" id="searchTxt" />

And assume the following AJAX call:

$.ajax({
    type: "POST",
    url: "tdat.php",
    data: {userresponse: $('#searchTxt').val()},
    success: function(){
        $('#searchTxt').val("")
    }
})

What should happen is that the data "userresponse" gets posted to the server, having the value of whatever is inside the input box, and then the input in the box is emptied.

Later, I have the following PHP code in tdat.php:

<?php
    if(isset($_POST['userresponse'])){
        $userResponsePHP = $_POST['userresponse'];
        switch($userResponsePHP){
            case "yes":
            echo "alert(\"hi\")";
            break;
        case "no":
            echo "alert(\"negative!\")";
            break;
        default:
            echo "alert(\"nope.\")";
            break;
        }
    }
?>

The PHP does not respond, even if the AJAX call works perfectly. PHP does not even receive the value of "userresponse". I have checked the file paths, localhost connection, adding quotes to "userresponse", and practically all other minor issues stated in other threads, but the problem persists. The AJAX call clears the value of searchTxt, thus it is a successful send. No errors are shown in the console. Why is this so?

try instead of isset($_POST['userresponse']) use !empty($_POST['userresponse']) — guradio
– guradio, Commented May 10, 2016 at 4:17
I had same problem, I replaced key userresponse with "userresponse", try — sandesh
– sandesh, Commented May 10, 2016 at 4:20
Please make some clarifications: 1.When the ajax call is triggered. — rajthakur
– rajthakur, Commented May 10, 2016 at 4:34

madalinivascu · Accepted Answer · 2016-05-10 04:51:12Z

2

Try the following:

$.ajax({
    type: "POST",
    url: "tdat.php",
    data: {userresponse: $('#searchTxt').val()},
    success: function(data){
        alert(data.message);
        $('#searchTxt').val("");
    }
})

php:

<?php
    header('Content-Type: application/json');
    if(isset($_POST['userresponse'])){
        $userResponsePHP = $_POST['userresponse'];
        switch($userResponsePHP){
            case "yes":
            echo json_encode(["message"=>"hi"]);
            break;
        case "no":
            echo json_encode(["message"=>"negative"]);
            break;
        default:
            echo json_encode(["message"=>"nope"]);

            break;
        }
    }
?>

Note: if the page is refreshing you aren't doing any ajax

edited May 10, 2016 at 4:51

answered May 10, 2016 at 4:34

madalinivascu

32.4k4 gold badges41 silver badges59 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

guradio Over a year ago

i think you need to set dataType:'json'

madalinivascu Over a year ago

@guradio jquery will take care of that

user5348307 · Accepted Answer · 2016-05-10 04:46:50Z

The following code snippet works, however it's generally recommended not to use eval I'm using eval in this case because you have the JavaScript alert function on the server-side (in the PHP). What you should do is echo the text and then call the alert function on the Javascript side. However, in the interest of changing as little as possible to your code I'm leaving it as is and only making changes in the JavaScript.

2 things to make note of in this example I initialize the text box with one of your accepted values 'yes'. Of course you can change this so the ajax call is made on say a button click (wasn't sure what your use case was)

One small thing you forgot was to read in the data parameter in the success callback.

<script   src="https://code.jquery.com/jquery-2.2.3.min.js"   integrity="sha256-a23g1Nt4dtEYOj7bR+vTu7+T8VP13humZFBJNIYoEJo="   crossorigin="anonymous"></script>
<script>
$( document ).ready(function() {
   $('#searchTxt').val("yes");
       $.ajax({
           type: "POST",
           url: "tdat.php",
           data: {userresponse: $('#searchTxt').val()},
           success: function(data, textStatus, jqXHR) {
              eval(data);
              $('#searchTxt').val("")
           }
        })
    });
</script>
<input maxlength="50" size="50" id="searchTxt" />

madalinivascu · Accepted Answer · 2016-05-10 05:02:58Z

0

Modify your ajax function first as follows:

$('#searchTxt').change(function(){
    $.ajax({
        type: "POST",
        url: "tdat.php",
        data: {userresponse: $('#searchTxt').val()},
        success: function(res){
            $('#searchTxt').val("");
            console.log(res);
        }
     });
 });

On the change event of searchTxt your ajax call will be executed and then check the console.

edited May 10, 2016 at 5:02

madalinivascu

32.4k4 gold badges41 silver badges59 bronze badges

answered May 10, 2016 at 5:01

rajthakur

4536 silver badges16 bronze badges

2 Comments

rajthakur Over a year ago

What are you getting?

madalinivascu Over a year ago

why do you have html in your php ?,do you have 2 separate files one with the ajax and one with the php?,how do you trigger your ajax?

Collectives™ on Stack Overflow

Why does PHP not receive POST data sent via AJAX?

3 Answers 3

2 Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related