setting data property of a jquery ajax method to contain a javascript object with an array property

Question

I'm having trouble setting the data property of a jquery ajax method to contain a javascript object that has a property called EngineSpecs.

I came up with something like this to test, but it's not working:

var myObject = new Object();
myObject.EngineSpecs = {};


var data = {
       myObject.EngineSpecs : [{
            EngineID: 100010017,
            Displacement: 7.2,
            Gas: false
            }, {
            EngineID: 300200223,
            Displacement:  3.2,
            Gas: true
       }]
};

$.ajax({
        url: someurl,
        dataType: "json",
        data: myObject

I keep getting an error like:

Message":"An error has occurred.","ExceptionMessage":"Cannot deserialize the current JSON object

Any help would be greatly appreciated!

in addition to the answers and previous comments, in your ajax call you're setting data:myObject, I think it should be data:data — TommyBs
– TommyBs, Commented Apr 9, 2013 at 16:09
How would this work when populating the property values in a loop? Without overwriting previous entries? -Thanks — SkyeBoniwell
– SkyeBoniwell, Commented Apr 9, 2013 at 16:49

Blazemonger · Accepted Answer · 2013-04-09 16:08:17Z

1

You are attempting to use myObject.EngineSpecs as an object property name, which isn't allowed (because of the . in the middle). Do this instead:

var data = {
       myObject: {
            EngineSpecs : [{
              EngineID: 100010017,
              Displacement: 7.2,
              Gas: false
            }, {
              EngineID: 300200223,
              Displacement:  3.2,
              Gas: true
            }]
       }
};

or possibly what you really wanted was:

  var myObject = {
        EngineSpecs : [{
          EngineID: 100010017,
          Displacement: 7.2,
          Gas: false
        }, {
          EngineID: 300200223,
          Displacement:  3.2,
          Gas: true
        }]
   };

answered Apr 9, 2013 at 16:08

Blazemonger

93.3k28 gold badges147 silver badges181 bronze badges

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

2 Comments

SkyeBoniwell Over a year ago

I think this would work for testing. How would this work when populating the property values in a loop?

Blazemonger Over a year ago

No idea. I haven't seen the rest of your code. That sounds like it should be a separate question -- after you've given it a try on your own, of course.

cosmixtew · Accepted Answer · 2013-04-11 04:51:25Z

There are several problems with your code which seem to stem from lack of understanding of js objects and object properties. Understanding these will save you hours of headache later on.

First thing (a minor one) I would like to point out is mixing of your object declarations.

var myObject = new Object();
// is the equivalent of:
var myObject = {};

Similar with arrays:

var myArray = new Array();
//is the equivalent of:
var myArray = [];

It doesn't matter which pattern you choose to go with (js community prefers [] and {}), but be sure you are consistent with your approach.

Second, think about objects as associative arrays, i.e. list of key -> value pairs. These keys are referred to as object properties. So all objects should follow the following pattern:

// Note: each object property declaration is comma separated.
var myObject = {
  propertyString: 'this is a string',
  propertyAnotherString: 'this is another string',
  propertyMixedArray: ['item 1', 'item 2', 1, 2, {}],
  // Note above, we have different data types in the array:
  // two strings, two ints and one empty object.
  // This is completely legal in javascript.
  propertyObject: { someProperty: 'and so on...' }
};

// Adding additional properties is OK too.
// Note: this time we use '=' instead of ':' to assign value
myObject.additionalProperty = 'Additional property';

// prints 'this is a string'
console.log(myObject.propertyString);

// also prints 'this is a string'
// I'm treating object as an associative array or hashtable
console.log(myObject['propertyString']);

// also prints 'this is a string'
// we can use variables as well to dynamically access keys.
var keyFromVariable = 'propertyString';
console.log(myObject[keyFromVariable]);

// Couple of other examples.
console.log(myObject.propertyMixedArray[1]); // prints 'item 2'
console.log(myObject.propertyObject.someProperty); // prints 'and so on...'
console.log(myObject.additionalProperty); // prints 'Additional property'

This might be overwhelming initially, but you get used to it over time. It's important however to keep the ideas above in the back of your mind at all times while writing javascript code. Now that we know a little more about objects, we can rewrite your code in a following way:

var myObject = {
  EngineSpecs: [{
      EngineID: 100010017,
      Displacement: 7.2,
      Gas: false
      }, {
      EngineID: 300200223,
      Displacement:  3.2,
      Gas: true
  }]
};

$.ajax({
  url: 'http://www.someurlhere.com/api.json',
  dataType: "json",
  data: myObject
});

I hope this helps.

Collectives™ on Stack Overflow

setting data property of a jquery ajax method to contain a javascript object with an array property

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related