How to catch data sent by Ajax using PHP

Question

Would like to ask for a help. I'm having an issue about getting the right data that I wanted. Maybe there's something lack in my code. I always get null.

I didn't received any error on the console tab.

Here's my ajax

$(document).ready(function() {
  $(".fsubmit").click(function() {    
   var emailval = $("#email").val().trim();
   
   $.ajax({
    url: '/test.php',
    type: 'POST',
    dataType: 'json',
    data: 'email='+emailval,
    success: function(data) { 
     console.log(data);
     return false;
    }
   });
  });
 });

Maybe you could help me fix the PHP. Still learning some stuff. Kindly put some details for lesson please.

Here's my PHP code

<?php 

    $date = new DateTime();
    $datelog = $date->format('d.m.Y h:i:s');
    $data = $_POST['data'];

    $message = '[' . $datelog . '] - email: ' . json_encode($data);

    echo($message);
?>

I appreciate your answer!

score 0 · Answer 1 · answered Feb 06 '17 at 10:00

0

try this:

$(document).ready(function() {
    $(".fsubmit").click(function() {    
        var emailval = $("#email").val().trim();

        $.ajax({
            url: '/test.php',
            type: 'POST',
            dataType: 'json',
            data: {email:emailval},
            success: function(data) {   
                console.log(data);
                return false;
            }
        });
    });
});

then in php:

<?php 

    $date = new DateTime();
    $datelog = $date->format('d.m.Y h:i:s');
    $data = isset($_POST['email'])?$_POST['email']:'';

    $message = '[' . $datelog . '] - email: ' . json_encode($data);

    echo($message);
?>

You should always check for the posted elements if its isset or not.

answered Feb 06 '17 at 10:00

Mohammad

3,449
6
48
75

still didn't received by PHP. The output null became a blank. – Kobe Bryan Feb 06 '17 at 10:10
@KobeBryan try to var_dump the post request `var_dump($_POST)` and share us the output – Mohammad Feb 06 '17 at 10:17
is this what you meant? $data = var_dump($_POST['email'])?$_POST['email']:''; ? – Kobe Bryan Feb 06 '17 at 10:18
this is the output: NULL [06.02.2017 10:20:08] - email: "" – Kobe Bryan Feb 06 '17 at 10:21
@KobeBryan No, just type `var_dump($_POST);` alone – Mohammad Feb 06 '17 at 10:22
here's the output array(0) { } [06.02.2017 10:26:01] - email: null. What does it mean? – Kobe Bryan Feb 06 '17 at 10:26
@KobeBryan there is nothing posted to your php page, please check your network activity in the browser "inspect element -> network tab" then filter the "XHR", do you see your request? what are the parameters handled within it ? – Mohammad Feb 06 '17 at 10:32
i've seen all my test.php activities. – Kobe Bryan Feb 06 '17 at 10:36

sujan basnet · Accepted Answer · 2017-02-06T10:42:46.250

0

Not allowed to comment. Here's a little edit to Mohammad's answer. isset() returns true for blank form fields. Use empty() instead.

this runs in my system ..

ajax call

    $(document).ready(function(e) {
        $(".fsubmit").click(function() {  
            e.preventDefault();
            console.log("whooowww");
            var emailval = $("#email").val().trim();

            $.ajax({
                url: '/arrayfilter.php',
                type: 'POST',
                dataType: 'json',
                data: 'email='+emailval,
                success: function(data) {   
                    console.log(data);
                    return false;
                }
            });
        });
    });

html form

<form>
    <input type="text" name="user-input" id="email"/>
    <button type="submit">Send</button>
</form>

php

if($_POST){
    if(!empty($_POST['email']))
        echo "$_POST[email]";
    }
}

edited Feb 06 '17 at 10:42

answered Feb 06 '17 at 10:10

sujan basnet

190
2
12

the output became null again. hmm – Kobe Bryan Feb 06 '17 at 10:15
is fsubmit a – sujan basnet Feb 06 '17 at 10:19
Submit – Kobe Bryan Feb 06 '17 at 10:20
i am assuming email in in a form ? if so add e.preventDefault() to your click event handler $('.fsumbit').click(function(e){ e.preventDefault(); //rest of the code } – sujan basnet Feb 06 '17 at 10:25
the button is not functioning anymore when I added e.preventDefault(). Also I didn't see any error in the console tab. – Kobe Bryan Feb 06 '17 at 10:31
i copied your code and implemented it in my system and works. let me edit my answer and give all of the code – sujan basnet Feb 06 '17 at 10:37
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/134958/discussion-between-sujan-basnet-and-kobe-bryan). – sujan basnet Feb 06 '17 at 10:43

score 0 · Answer 3 · edited May 23 '17 at 10:29

The JS

I can see - at least - one major flaw in your JS code. You are passing data: 'email='+emailval to the request. This would be fine (well - possibly not, since you are not URL-encoding your message) for a GET, but with the post I'd doubt, that jQuery can make some decent JSON out of email=Some arbitrary text. At least it will make your JS vulnerable to injections. There are answers on how to send JSON to a webservice with jQuery, please see here.

The PHP

$_POST['data'] (if this is correct) will contain a string. But according to the PHP documentation

json_encode — Returns the JSON representation of a value

I don't think that this is what you want to do. You have a string, and you'll probably want to get an object from your JSON string (actually at the moment, I doubt that it's really a JSON string what you are passing). You can achieve this with json_decode, which

json_decode — Decodes a JSON string

I'd suggest the following PHP code, which decodes the JSON into an array and then outputs the value of email

$data = json_decode($_POST['data'], true);

$message = '[' . $datelog . '] - email: ' . $data["email"];

For this to work, $_POST['data'] will have to look like this

{'email': 'Your message'}

or the like.

How to catch data sent by Ajax using PHP

3 Answers3

The JS

The PHP