Push values to array in jquery

Question

I have List of items data and empty array quotations :

   var data = {};
   var quotations = [];

I want to fill quotations with data values ,Every time i add new data it added successfully but all data values get last value .

for example :

 $("#addquotation").click(function () {
        debugger;
        var itemname = $("#itemname").val();
        var cost =parseFloat( $("#cost").val());
        var notes = $("#notes").val();
        var date = $("#date").val();


        data.Item = itemname;
        data.Cost = cost;
        data.Notes = notes;
        data.Date = date;

        quotations.push(data);
)};

for first time i add

"test,45,testnotes,2016-02-03" Second time i 've added "test2,45.2,testnotes2,2016-02-05"

when i debug i get data as :

obj(0): "test2,45.2,testnotes2,2016-02-05" obj(1):"test2,45.2,testnotes2,2016-02-05"

it seems it append last version to all data

Please Advice . Thanks

HaukurHaf · Accepted Answer · 2016-03-20 20:36:48Z

20

You need to declare data inside the click handler, if it's declared as a global variable you are basically always modifying and adding the same data object to the array:

var quotations = [];

$("#addquotation").click(function () {
        debugger;
        var data = {};
        var itemname = $("#itemname").val();
        var cost =parseFloat( $("#cost").val());
        var notes = $("#notes").val();
        var date = $("#date").val();


        data.Item = itemname;
        data.Cost = cost;
        data.Notes = notes;
        data.Date = date;

        quotations.push(data);
)};

answered Mar 20, 2016 at 20:36

HaukurHaf

13.9k6 gold badges47 silver badges62 bronze badges

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

Comments

charlietfl · Accepted Answer · 2016-03-20 20:37:12Z

2

You are pushing the same object reference each time since you declared data outside of the click handler.

Change from :

var data={};
$("#addquotation").click(function () {

To

$("#addquotation").click(function () {
     var data={};// declare local variable

answered Mar 20, 2016 at 20:37

charlietfl

172k14 gold badges125 silver badges154 bronze badges

Comments

afuous · Accepted Answer · 2016-03-20 20:40:28Z

The problem is that data is a global variable and you add a reference to data to quotations.

When the first value is pushed to quotations, data and quotations[0] refer to the same object. Here is an example of what is happening:

var a = {num: 1};
var b = a;
b.num = 2;
console.log(a.num); // prints 2

The same thing happens when an object is pushed to an array. quotations does not contain a copy of data, it contains a reference to data so that modifying data also modifies quotations. To fix this, each element of quotations must refer to a different data object. This can be accomplished by defining data inside of the function instead of outside.

Replace

var data = {};
$("#addquotation").click(function() {
    // populate data, push to quotations
});

with

$("#addquotation").click(function() {
    var data = {};
    // populate data, push to quotations
});

Collectives™ on Stack Overflow

Push values to array in jquery

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related