angularjs - POST request to PHP does not retrieve any data when using a form instead of angular http client

Question

I am using angular http client to interact with database and everything works but when I am trying to POST data to the same link using a form, I get that the data is undefined.

I was trying to encode, decode values as I know that before making any POST request and sending data, I need to perform angular.toJSON method, but that did not work.

This is my index.php where I receive a POST request from the form.

if (empty($action)) {
    if ((($_SERVER['REQUEST_METHOD'] == 'POST')) && 
             (strpos($_SERVER['CONTENT_TYPE'], 'application/json') !== false)) {

        $input = json_decode(file_get_contents('php://input'), true);

        $action = isset($input['action']) ? $input['action'] : null;
        $subject = isset($input['subject']) ? $input['subject'] : null;
        $data = isset($input['data']) ? $input['data'] : null;
    }

case 'createNote':
        // if I die() here, it prints the die()
        if(!empty($data)) {
            // if I die() here, $data is undefined.
            $data = json_decode($data);

            $user = $data[0];
            $comment = $data[1];
            $film_id = $data[2];
            $lastupdated = date("Y-m-d H:i:s");


            $sql = "INSERT INTO nfc_note (user, film_id, comment, lastupdated) 
                    VALUES (:user, :film_id, :comment, :lastupdated)";
        }
        break;

My form that I use to send POST request

<form action="index.php" method="POST">
    <input type="hidden" name="action" value="create">
    <input type="hidden" name="subject" value="note">
    <input type="hidden" name="data" value="<?php echo "['username','content', 1]"; ?>">

    <input type="submit" value="Submit">
</form>

As mentioned above, it works when I use angular's http and pass parameters like this:

this.createNote = function (data) {

    var defer = $q.defer(),
    data = {
        action: "create",
        subject: "note",
        data: angular.toJson(data)
    };
    $http
        .post(urlBase, data)
        .success(function (response) {
            defer.resolve({
                data: response.data
            });
        })
        .error(function (error) {
            defer.reject(error);
        });

    return defer.promise;
};

Does not work when I use a form. Any suggestions or mistakes that I am not aware of?

Answer 1

Your PHP code is expecting Json formatted data, and it is not getting that. It is because the HTML Form sends out POST data as application/x-www-form-urlencoded.

To support both data formats, you need to build a logic on your PHP code to detect either format. The data format is mentioned in the HTTP header where you can check that. Look for Content-Type. For POST data coming for your HTML form, it is application/x-www-form-urlencoded and for the Json it should be application/json.

You can read the form values in PHP by using $_POST[<form_parameter>]. In your case $_POST['data']. To make your HTML form a bit simpler you can also split the data array into their own inputs in the form.

See this for some more info: https://www.smtpeter.com/en/documentation/json-vs-post