formData object sent with jQuery ajax to server returns empty array on success

Question

the title basically says it all.

I am collecting some data and appending it into the formData object in order to POST it to my PHP file and handle the rest there.

My Ajax function:

save.addEventListener("click", function(e){
    e.preventDefault();
    getAllContents();
    console.log(updateObj);

    updateObj = JSON.stringify(updateObj);
    console.log(updateObj);

    $.ajax({
        url: "test.php",
        type: "POST",
        data: updateObj,
        success: function(response){
            console.log("Success: ", response);
        },
        error: function(response){
            console.log("Error: ", response);
        }
    });
});

The updateObj contains everything which I appended to the formData Object. The console log of this variable returns everything. So the problem must be right in the ajax POST.

Update The content of console.log(updateObj) :

[{"row_id":1,"status":"Anmeldung","ma_name":"AA","datum":"/","fa1":"testname1","fa2":"testname2","limit":"10.000","gruppe_kredit":"/","omv_kdnr":"8124213","sap_kdnr":"/","fos":"/","hga_kdnr":"/"},{"row_id":3,"status":"Anmeldung","ma_name":"AA","datum":"/","fa1":"ame1","fa2":"name2","limit":"12.000","gruppe_kredit":"/","omv_kdnr":"81515616","sap_kdnr":"/","fos":"/","hga_kdnr":"/"},{"row_id":2,"status":"Kunde","ma_name":"AA","datum":"/","fa1":"newname1","fa2":"newname2","limit":"15.323","gruppe_kredit":"/","omv_kdnr":"81515616","sap_kdnr":"/","fos":"/","hga_kdnr":"/"}]

My PHP File only contains a print_r of the $_POST

<?php 
   print_r($_POST);
?>

This is what my success function of the ajax call logs :

success:  Array
(
)

UPDATE2

This is how my formData Object gets filled in :

// console.log($test.length);
var updateObj = [];

function getAllContents(){
    var $tableTr = $('tbody tr');
    updateObj = [];

    $tableTr.each(function(index, element){
        var $row_id = $(this).data("rowid");
        // console.log("ID in Table: " + $row_id);
        var status = $(this).find('#status option:selected').val();
        // console.log("ID "+$row_id+" in der Table hat den Status: "+status);
        var ma_name = $(this).find('#ma-name').val();
        // console.log(ma_name);
        var datum = $(this).find('#datum').val();
        // console.log(datum);
        var firmenname1 = $(this).find('#firmenname1').val();
        // console.log(firmenname1);
        var firmenname2 = $(this).find('#firmenname2').val();
        // console.log(firmenname2);
        var limit = $(this).find('#limit').val();
        // console.log(limit);
        var gruppe_kredit = $(this).find('#gruppe_kredit').val();
        // console.log(gruppe_kredit);
        var omv_kdnr = $(this).find('#omv_kdnr').val();
        // console.log(omv_kdnr);
        var sap_kdnr = $(this).find('#sap_kdnr').val();
        // console.log(sap_kdnr);
        var fos = $(this).find('#fos').val();
        // console.log(fos);
        var hga_kdnr = $(this).find('#fos').val();
        // console.log(hga_kdnr);

        var pushObj = {
                        row_id: $row_id,
                        status: status,
                        ma_name: ma_name,
                        datum: datum,
                        fa1: firmenname1,
                        fa2: firmenname2,
                        limit: limit,
                        gruppe_kredit: gruppe_kredit,
                        omv_kdnr: omv_kdnr,
                        sap_kdnr: sap_kdnr,
                        fos: fos,
                        hga_kdnr: hga_kdnr
                    };

        updateObj.push(pushObj);
        // PushObjekt mit Inhalt befüllen und das PushObjekt ins updateObjekt einbetten

        //console.log(updateObj);
    });
}

 getAllContents();

before calling ajax, you have console.log(). is that giving expected result?? — Niranjan N Raju
– Niranjan N Raju, Commented Oct 15, 2015 at 6:55
The ajax request properly calls the test.php target. The result or its print_r of $_POST is still empty though — noa-dev
– noa-dev, Commented Oct 15, 2015 at 7:20

Minato · Accepted Answer · 2015-10-15 11:59:19Z

2

The Problem is that you are trying to send an array of JS objects. in this case normal JSON.stringify(obj) won't work as there are no keys on the individual objects so the object wouldn't get encoded properly into a string so on server end it won't be parsed properly and wonldn't get passed to the $_POST. One solution could be

updateObj = [{"row_id":1,"status":"Anmeldung","ma_name":"AA","datum":"/","fa1":"testname1","fa2":"testname2","limit":"10.000","gruppe_kredit":"/","omv_kdnr":"8124213","sap_kdnr":"/","fos":"/","hga_kdnr":"/"},{"row_id":3,"status":"Anmeldung","ma_name":"AA","datum":"/","fa1":"ame1","fa2":"name2","limit":"12.000","gruppe_kredit":"/","omv_kdnr":"81515616","sap_kdnr":"/","fos":"/","hga_kdnr":"/"},{"row_id":2,"status":"Kunde","ma_name":"AA","datum":"/","fa1":"newname1","fa2":"newname2","limit":"15.323","gruppe_kredit":"/","omv_kdnr":"81515616","sap_kdnr":"/","fos":"/","hga_kdnr":"/"}];
        // window.updateObj =
    console.log(updateObj);
    Obj = {};
    $.each(updateObj,function(x,obj){ Obj[""+x] = obj;});
    // updateObj = JSON.stringify(updateObj);
    updateObj = JSON.stringify(Obj);
    console.log(Obj);

$.ajax({
        url: "//localhost:80/test/",
        type: "POST",
        data: updateObj,
        success: function(response){
            console.log("Success: ", response);
        },
        error: function(response){
            console.log("Error: ", response);
        }
    });

------------------------update----------------------

You can also do it like this but it'll be a bit tricky to decode on the server size I guess.

updateObj = [{"row_id":1,"status":"Anmeldung","ma_name":"AA","datum":"/","fa1":"testname1","fa2":"testname2","limit":"10.000","gruppe_kredit":"/","omv_kdnr":"8124213","sap_kdnr":"/","fos":"/","hga_kdnr":"/"},{"row_id":3,"status":"Anmeldung","ma_name":"AA","datum":"/","fa1":"ame1","fa2":"name2","limit":"12.000","gruppe_kredit":"/","omv_kdnr":"81515616","sap_kdnr":"/","fos":"/","hga_kdnr":"/"},{"row_id":2,"status":"Kunde","ma_name":"AA","datum":"/","fa1":"newname1","fa2":"newname2","limit":"15.323","gruppe_kredit":"/","omv_kdnr":"81515616","sap_kdnr":"/","fos":"/","hga_kdnr":"/"}];
    console.log(updateObj);
    Obj = {};
    Obj["updateObj"] = updateObj;
    updateObj = JSON.stringify(Obj);
    $.ajax({
            url: "//localhost:80/test/",
            type: "POST",
            data: updateObj,
            success: function(response){
                console.log("Success: ", response);
            },
            error: function(response){
                console.log("Error: ", response);
            }
        });

----------update2.0

updateObj = [{"row_id":1,"status":"Anmeldung","ma_name":"AA","datum":"/","fa1":"testname1","fa2":"testname2","limit":"10.000","gruppe_kredit":"/","omv_kdnr":"8124213","sap_kdnr":"/","fos":"/","hga_kdnr":"/"},{"row_id":3,"status":"Anmeldung","ma_name":"AA","datum":"/","fa1":"ame1","fa2":"name2","limit":"12.000","gruppe_kredit":"/","omv_kdnr":"81515616","sap_kdnr":"/","fos":"/","hga_kdnr":"/"},{"row_id":2,"status":"Kunde","ma_name":"AA","datum":"/","fa1":"newname1","fa2":"newname2","limit":"15.323","gruppe_kredit":"/","omv_kdnr":"81515616","sap_kdnr":"/","fos":"/","hga_kdnr":"/"}];
        // window.updateObj =
    console.log(updateObj);
    Obj = {};


    var Obj = updateObj.reduce(function(o, v, i) {
       o[i] = v;
       return o;
    }, {});
    updateObj = JSON.stringify(Obj);
    console.log(Obj);

$.ajax({
        url: "//localhost:80/test/",
        type: "POST",
        data: updateObj,
        success: function(response){
            console.log("Success: ", response);
        },
        error: function(response){
            console.log("Error: ", response);
        }
    });

edited Oct 15, 2015 at 11:59

answered Oct 15, 2015 at 7:56

Minato

4,5431 gold badge25 silver badges30 bronze badges

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

6 Comments

noa-dev Over a year ago

Weirdly enough the solution of you doesnt work any more. Empty response again

Minato Over a year ago

your updateObj must have changed or the obj is not formatted properly.

noa-dev Over a year ago

The updateObj is still the same. Like in my update in my question

Minato Over a year ago

normally the formData is primarily a single formatted JS hash/object so its easy to encode it into a JSON, but in your case its an array of hashes/objects and that so without a key.

Minato Over a year ago

which one are you trying to? the former or the later?

|

Rohit Kumar · Accepted Answer · 2015-10-15 07:33:27Z

0

Try This- at ajax call-

   $.ajax({
            url: "test.php",
            type: "POST",
            dataType: "json",
            data: updateObj,
            success: function(response){
                console.log("Success: ", response);
            },
            error: function(response){
                console.log("Error: ", response);
            }

At Php

<?php 
   echo json_encode($_POST,true);
?>

answered Oct 15, 2015 at 7:33

Rohit Kumar

1,9581 gold badge12 silver badges17 bronze badges

Comments

Minesh Patel · Accepted Answer · 2015-10-15 08:25:34Z

0

Try with parameter json if you want to get response in json format [Edit]

save.addEventListener("click", function(e){
        e.preventDefault();
        getAllContents();
        console.log(updateObj);

        updateObj = JSON.stringify(updateObj);
        console.log(updateObj);

        $.ajax({
            url: "test.php",
            type: "POST",
            dataType: "json",
            data: ({data:updateObj}),
            success: function(response){
                console.log("Success: ", response);
            },
            error: function(response){
                console.log("Error: ", response);
            }
        });
    });

and on server side

parse_str($_POST['data'],$data);
echo json_encode($data);exit;

edited Oct 15, 2015 at 8:25

answered Oct 15, 2015 at 7:05

Minesh Patel

5411 gold badge6 silver badges14 bronze badges

3 Comments

noa-dev Over a year ago

Tried it out. The result of that echo is still empty.

noa-dev Over a year ago

the content or how it gets generated?

Minesh Patel Over a year ago

Let us continue this discussion in chat.

Collectives™ on Stack Overflow

formData object sent with jQuery ajax to server returns empty array on success

3 Answers 3

6 Comments

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

6 Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related