Passing array from Javascript to PHP via POST

Question

I've looked at several other suggestions on this issue but for some reason my data is not being posted. Here is the relevant section of my code:

<input type="button" id="map_submit" value="Map Selection" />
<?php var_dump($_POST); ?>  // display the posted variables

and

<script type="text/javascript">
    $(document).ready(function(){
        $('#map_submit').click(function(){

            /*  this part is from the slickgrid plugin, in which
             *  selectedData is an array that I want to post to the page
             *  and read via php
             */
            var selectedData = [], selectedIndexes;
            selectedIndexes = grid.getSelectedRows();
            jQuery.each(selectedIndexes, function (index, value) {
                 selectedData.push(grid.getData()[value]);
            });

            $.post("mapper.php", {dataArray: selectedData});
        });
    });
</script>

From what I've seen from other questions, $.post should work. But, when I click the button, nothing is shown from the var_dump. As a sanity check, if I add this to the javascript:

for (var i = 0; i < selectedData.length; i++) {
     document.write(selectedData[i].questionID + "<br />");
}

it will print the questionID values I selected in the grid (of course to a newly blank page).

Answer 1

$.post("mapper.php", {dataArray: selectedData});

This line is fine. I don't know why everyone is suggesting JSON, because that's unnecessary here. You can just POST objects/arrays normally without using JSON.

Note: this will not reload the page. It will POST to mapper.php via AJAX, so aren't going to see anything anywhere on the page. You'd need to look in your dev tools to see what the AJAX call returned.

Or, you can check the data the POST returns.

$.post("mapper.php", {dataArray: selectedData}, function(data){
    console.log(data); // check your console, you should see some output
});

Answer 2

You'll have to serialize the object pre-post and then deserialize on the server (presumably in PHP) before you can use it.

Example below (requires json2.js):

<script type="text/javascript">
    $(document).ready(function(){
        $('#map_submit').click(function(){

            /*  this part is from the slickgrid plugin, in which
             *  selectedData is an array that I want to post to the page
             *  and read via php
             */
            var selectedData = [], selectedIndexes;
            selectedIndexes = grid.getSelectedRows();
            jQuery.each(selectedIndexes, function (index, value) {
                 selectedData.push(grid.getData()[value]);
            });

            $.post("mapper.php", JSON.stringify({dataArray: selectedData}));
        });
    });
</script>

<input type="button" id="map_submit" value="Map Selection" />
<?php var_dump(json_decode($_POST, true)); ?>  // display the posted variables