JavaScript 推送到阵列 object 不起作用

Question

I have an html like below

HTML:

 <INPUT TYPE=CHECKBOX NAME="clcik" onClick="add('1234','blah')" />
 <input type="hidden" id="project" value="" />

JS:

    function add(obj1 , obj2){
    var jsonArray = [];
    var jsonObj = { product_id : obj1 , name : obj2 };
    jsonArray.push(jsonObj);
    var field = document.getElementById('project');
    field.setAttribute('value', JSON.stringify(jsonArray));
    alert(field.getAttribute('value'));
    }

I am trying to set first and retrieve again to check but nothing is happening..I can't understand where I am wrong...?

Answer 1

I guess you missed to get the stringify result into stringData variable because of which you are getting a js error before it reaches the line where you are trying to alert the value.

JSON or JSON.stringify is not provided by jQuery you have to include json2 library on the page if the browser natively do not support it.

Try this

function add(obj1 , obj2){
    var jsonArray = [];
    var jsonObj = { product_id : obj1 , name : obj2 };

    jsonArray.push(jsonObj);
    var stringData = JSON.stringify(jsonArray);

    var field = document.getElementById('project');

    field.setAttribute('value', stringData);
    alert(field.getAttribute('value'));
}

Code to remove element from array based on your request in the comment.

var newArray = [], productIdToRemove = "1234";
$.each(jsonArray, function(){
   if(this.product_id != productIdToRemove){
      newArray.push(this);
   }
});

//Now newArray will not have '1234'

Answer 2

Change

JSON.stringify(jsonArray)
// to
var stringData = JSON.stringify(jsonArray);

---

Other problems with the fiddle, fixed: http://jsfiddle.net/mattball/qWCwa/7/

Answer 3

In your example, you never set stringData .

Answer 4

get/set the "value" property directly on the input, not getAttribute and setAttribute methods.

Answer 5

After changing the code to assign stringData, it seems to work for me:

function add(obj1 , obj2){
    var jsonArray = [];
    var jsonObj = { product_id : obj1 , name : obj2 };
    jsonArray.push(jsonObj);
    var stringData = JSON.stringify(jsonArray)
    var field = document.getElementById('project');
    field.setAttribute('value', stringData);
    alert(field.getAttribute('value'));
    }

add(1, 2);

You can see it working here: http://jsfiddle.net/jfriend00/HNuak/ .

FYI, if you just run in an environment where you can see javascript execution errors (like the Chrome or Firefox debuggers), errors like this would be easy to see in the error console.