How to get data from FormData in a php file

Question

I have the following form:

<form id="f-comment" class="form" method="post" action="submit_img_comment.php">
    <textarea name="comment"></textarea>
    <input type="submit" value="Publish" data-params='{"imageid":<?php echo $imageid; ?>}'>
</form>

and the following javascript:

$(document).on("submit", ".form", function(e) {
    e.preventDefault();

    // what form are you submitting?
    var form = $("#" + e.target.id);

    var data = new FormData(this);
    var params = $("input[type=submit]", this).data("params"); // parameters to send along with data
    data.append("params", params);

    // data is ok
    console.log(params)

    $.ajax({
        type: form.attr("method"),
        url: "include/" + form.attr("action"),
        data: data,
        dataType: "json",
        contentType: false,
        processData: false,
        cache: false
    }).done(function(data) {
        alert(data['msg']);
    }).fail(function(data) {
        alert("Error: Ajax Failed.");
    }).always(function(data) {
        // always do the following, no matter if it fails or not
    })
});

in my php file (submit_img_comment.php) im able to get the comment, like this

$_POST['comment'];

But, when i try to get the imageid, like this

$_POST['imageid'];

I get the error: Undefined index: imageid

The comment is part of the form, but the imageid is send as a parameter and appended in FormData.

How do i get the imageid in my php file?

Answer 1

You are look at this all wrong, what you have appended to your form is not imageid but params. Also, what you are sending is a javascript object, you need to convert this to a string first. You will need to do the following in JavaScript:

var data = new FormData(this);
var params = $("input[type=submit]", this).data("params"); // parameters to send along with data
var json_params = JSON.stringify(params); // This converts your javascript object into a string that you can send to the server.
data.append("params", json_params); // We are adding the string we have converted from the javascript object.

Now that we have sent a JSON string to the server, we now need to decode it. To decode the JSON in php we use:

$params = json_decode($_POST['params']);

The variable $params will now be a php object which contains imageid as a property. This means that your image id is now stored in $params->imageid variable e.g. echo $params->imageid will output your image id.

As @baboizk has rightly mentioned, you should use isset() in PHP to make sure it actually exists before using it. E.g.

$params = json_decode($_POST['params']);

// Check that imageid exists.
if(isset($params->imageid) == true) {
    // Do code that needs $params->imageid;
} else {
    // Fail gracefully.
}

Answer 2

You are probably attempting to acces an unset value and this leads to a runtime error. $_POST does not have any element with the index 'imageid' so your program gets aborted by the interpreter before it ever gets to the null test.

Here is where isset() is handy for testing the existence of a variable or array element without actually trying to acces it.

http://php.net/manual/en/function.isset.php