0

I am trying to pass an array in an array via ajax. If I do not pass in the additional array, it works just fine.

For example:

var settings = [];
// add stuff to the array

$.ajax({
    type: 'POST',
    url: "api/update-settings",
    data: {
        userId: 1,
        userSettings: settings
    },
    done: function(response) {
        //do something with the response
    },
    fail: function() {
        // do error stuff
    }
});

Sending this will not work. The API (in PHP) gets the code and is able to tell me what userId is, but userSettings is not defined.

Notice: Undefined index: userSettings in /api/update-settings.php on line 9

However, if I set the settings variable as a different data type (such as an int or string), the index is no longer undefined.

Within the PHP, when I dump request to see what's in it, userSettings is not found:

var_dump($_REQUEST);
Output: array(1) { ["userId"]=> string(1) "1" }

I'm adding items to my array using settings['template'] = template;

Before I submit the ajax request, I can console log it and I get this:

[p: "setting1", s: 1587, emp: "setting2", ems: 3245, template: "", …]

which contains all data that I need.

I tried to stringify the data with JSON.stringify(settings) but then ajax passes an empty array:

array(2) { ["userId"]=> string(1) "1" ["userSettings"]=> string(2) "[]" }

I feel like this is something simple, but I can't figure it out. And yes, I've done my searches - I've found similar things, but none of the responses seem to help.

Thank you, in advance.

Apolymoxic
  • 730
  • 14
  • 34
  • 1
    Can you verify that you are actually sending all of the data via the network tab? Check this out https://stackoverflow.com/a/21617685/2191572 and find your "Request Headers". It's also possible that you are having cache issues or you are testing the completely wrong page. – MonkeyZeus Nov 08 '18 at 19:32
  • 2
    Are you sure you're actually "adding stuff to the (`settings`) array"? Because if you're not, I'm pretty sure it won't send anything for an empty `userSettings` array in the request's body. – Jeto Nov 08 '18 at 19:38
  • @MonkeyZeus - Well, if I change the variable to NOT be an array, it sends, so I am assuming it's sending. – Apolymoxic Nov 08 '18 at 19:53
  • @Jeto Yes, I am sure. If I do a console.log I get the full array filled with the correct data. – Apolymoxic Nov 08 '18 at 19:54
  • 1
    @Jeto is correct anyways, jQuery will not send an empty array like that. You can verify by doing `var settings = [ 'yay something!' ];` instead – MonkeyZeus Nov 08 '18 at 20:01
  • "I'm adding items to my array using settings['template'] = template;". So it's not an array, it's an object (on JS side). It should be declared with `var settings = {}`. – Jeto Nov 08 '18 at 20:05
  • @Jeto My apologies... I thought that was an array. I had declared it using `var settings = []` as the post says. Changing the `[]` to `{}` makes it work. Thank you – Apolymoxic Nov 08 '18 at 20:08
  • @Jeto if you submit an answer with that correction I will make it as accepted – Apolymoxic Nov 08 '18 at 20:09

2 Answers2

2

Considering the way you're adding values to your settings variable, what you want to manipulate/send is an object, not an array.

You need to change your declaration from:

var settings = [];

to:

var settings = {};
Jeto
  • 14,596
  • 2
  • 32
  • 46
0

Have you tried serializing the array? You can find this approach here, here and here.

so it could end up like

var settings = [];
// add stuff to the array

$.ajax({
    type: 'POST',
    url: "api/update-settings",
    data: {
        userId: 1,
        userSettings: JSON.stringify(settings);//here is the change
    },
    done: function(response) {
        //do something with the response
    },
    fail: function() {
        // do error stuff
    }
});

hope this helps.

Angel Tabares
  • 333
  • 4
  • 10