How to send an array of data to the Backend (php) through ajax

Question

I need some help here guys, my issue is that the first console.log returns what has been built by the foreach, but the backend doesn't receive that same array. This foreach basically iterates over a table, looks for a certain id, makes it an index of an array, and then it fetches all the input values from the table and pushes it to that given index.

        var dateTime = [];
        $("#employeeData > tr").each(function(dateIndex, date) {
            dateTime[date.id] = [];
            $("#" + date.id + " :input").each(function(inputIndex, inputTime) {
                dateTime[date.id].push($(inputTime).val())
            });
        });
        var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
        console.log(dateTime);
        $.post('employee',
            {
                dates: dateTime,
                _token: CSRF_TOKEN
            }, function(response) {
                console.log(response);
            }
        );
        });
    Route::post('/employee', 'EmployeesController@updateRecords');

    public function updateRecords(Request $request)
    {
        return $request->dates;
    }
    // this is a console.log of the dateTime, each date has 4 inputs 
    //associated with it
    [2017-11-02: Array(4), 2017-11-03: Array(4), 2017-11-06: Array(4), 2017- 
    11-07: Array(4), 2017-11-08: Array(4), …]

This all happens when jquery handles a click event.

Can you paste your controller code (backend) and your routing page as well? — JP. Aulet
– JP. Aulet, Commented Apr 26, 2018 at 9:43
the controller will recieve JSON data which you first need to json_decode() before you can $request->dates — Brainfeeder
– Brainfeeder, Commented Apr 26, 2018 at 9:47
As in return json_decode($request->dates);? didn't work. And if that were the case why does a dummy array work? — Daniel Santos
– Daniel Santos, Commented Apr 26, 2018 at 9:50

candidev · Accepted Answer · 2018-04-26 10:04:55Z

1

It is not possible to pass an array as it is in the post, it should be converted.

Just encode your array as JSON string and decode it in the backend.

var dateTime = [];
    $("#employeeData > tr").each(function(dateIndex, date) {
        dateTime[date.id] = [];
        $("#" + date.id + " :input").each(function(inputIndex, inputTime) {
            dateTime[date.id].push($(inputTime).val())
        });
    });
    var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
    console.log(dateTime);
    var jsonString = JSON.stringify(dateTime);
    $.post('employee',
        {
            dates: jsonString,
            _token: CSRF_TOKEN
        }, function(response) {
            console.log(response);
        }
    );
    });

in your PHP, decode the JSON string :

$dates = json_decode(stripslashes($_POST['dates']));

answered Apr 26, 2018 at 10:04

candidev

387 bronze badges

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

13 Comments

Daniel Santos Over a year ago

Returns an empty array, the data after the console log isn't reaching the backend.

Daniel Santos Over a year ago

In your version, when i console.log the jsonString, it is empty, before the $.post.

candidev Over a year ago

So the json encoding did not work with stringify function

Daniel Santos Over a year ago

It won't make a difference, the jsonString is empty, i logged it to the console, this is impossible theoretically, because i built the array on a loop before it.

candidev Over a year ago

The JSON.stringify (function to encode array as JSON) handles this (it can encode a multidimensional array) and in the backend you could access every value after decoding. But what makes a real issue is the empty result returned by JSON.stringify, have you checked and tried the solutions in the link stackoverflow.com/questions/7259728/json-stringify-returning

|

Collectives™ on Stack Overflow

How to send an array of data to the Backend (php) through ajax

1 Answer 1

13 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

13 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related