how to add the input values in an array

Question

i just like to ask regarding adding data in a array. But the data which i wanted to put is from a table of input boxes.. Here's the code that i've been practicing to get data:

http://jsfiddle.net/yajeig/4Nr9m/69/

I have an add button that everytime I click that button, it will store data in my_data variable.

i want to produce an output in my variable something like this:

my_data  = [ {plank:"1",thickness:"4",width:"6",length:"8",qty:"1",brdFt:"16"}] 

and if i would add another data again, it will add in that variable and it be something like this:

my_data  = [ {plank:"1",thickness:"4",width:"6",length:"8",qty:"1",brdFt:"16"},
     {plank:"2",thickness:"5",width:"6",length:"2",qty:"1",brdFt:"50"}] 

the code that i have right now is really bad, so please help.

Currently my output: 1,4,6,4,1

Answer 1

You should be able to iterate over all of the textboxes using the following:

function add(e) {
    var obj = {};

    $('#addItem input[type="text"]')
        .each(function(){obj[this.name] = this.value;});
    myItems.push(obj);
}

Where myItems is a global container for your items and #addItem is your form.

Updated jsfiddle.

If you use a form and a submit button then you should be able to implement a non-JavaScript method to add your information so that the site will be accessible to people without JavaScript enabled.