jquery multi dimensional array - one parent array with three child arrays

Question

My Fiddle: http://jsfiddle.net/gVwPw/3/

I have searched and found:

• Jquery multidimensional arrays
• How can I create a javascript associative array { } with dynamic key names?
• Jquery creating associative array with dynamic keys and multiple values

However I can't do what I'm trying still.

I have built an order entry page online, and they can dynamically add new lines to the order. each new line should be an array containing the details, like this (I'm using PHP as the array format here since I don't know proper javascript formatting)

Array
(
    [order_line_1] => Array
        (
            [sku] => afd433
            [uom] => CS
            [quantity] => 5
        )
)

I can't get it to store in this fashion. I've tried many methods. Help?!

Answer 1

Well JavaScript definitely supports multidimensional arrays. There are a few ways to interact with an array.

You can push other arrays into your original array like so:

originalArray.push(newArray);

You can explicitly set an array's index like so:

originalArray[1] = newArray;

If you are using an object as an analogue for a PHP associative array:

orders['orderLine1'] = newArray;

Personally I would use push, since it intelligently adds elements onto the array without breaking anything and maintains a 'first in first out' order.

Something like this:

// This array exists above in your scope
var orders = [];

// Whenever you are creating a new order line
var orderLine = [];
orderLine.push({
    sku: 'afd433',
    uom: 'CS',
    quantity: 5
});

// Whenever you are finished adding line-items to your order line
orders.push(orderLine1);

Answer 2

The easiest way to do this in JavaScript is to keep the outer array, but to make each element of the array be a standard JavaScript object. The syntax would look like this:

var arr = [
    { "sku": afd433, // assuming that afd433 is a variable, not a string
      "uom": "CS", // assuming that CS is a string, not a variable
      "quantity": 5
    } // if you have more elements, add a , then a new object with the {} syntax
];

The spacing doesn't matter; the following is equivalent and much more concise: var arr = [{"sku": afd433, "uom": "CS", "quantity": 5}];

Arrays don't mean much if they only contain one element, so I would make it look this way for multiple elements:

var arr = [
    {"sku": afd433, "uom": "CS", "quantity": 5},
    {"sku": afd334, "uom": "SC", "quantity": 7},
    {"sku": afd434, "uom": "SS", "quantity": 2}
];

Note that var x = [] is shorthand to create an array, and you can initialize it by listing elements. The most basic example would be var digits = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]. The {} syntax is shorthand to create a JavaScript dynamic object, where any parameter can be set to any value using the syntax above.