Assign JSON object to data field

Question

I am dynamically creating a string using javascript, here is the code below:

var row2 = "<tr><td><a href='#editModal' class='modal_trigger' data-info="+name+" data-toggle='modal'>Edit</a></td></tr>";

Here var is a JSON object. This is later transmitted modally when the user clicks on it, and values ​​can be obtained. However, just announcing varhow I did the above sets data-info=[Object object].

The contents of the JSON variable:

Object
  name: "Test 8"
  created_at: "2015-06-10 16:54:45"
  id: 128
  updated_at: "2015-06-10 16:54:45"
  __proto__: Object

Is there any way?

Answer 1

Some tips here:

• Do not use varas a variable name, even in examples (real code does not even compile)
• Please make sure you understand what JSON is because Javascript object! = JSON. Obviously, that varis the JS object in this case.

, JS, JSON JSON.stringify(variable):

: , :

var row2 = '<tr><td><a href="#editModal" class="modal_trigger" data-info="'+
        name+'" data-toggle="modal">Edit</a></td></tr>';

( )

Answer 2

[object Object], JSON, .
JSON - , , , .

JSON

"...data-info=" + JSON.stringify(myVar||null) + " data..."

null, , .

Answer 3

JSON.stringify(yourVar).

var row2 = "<tr><td><a href='#editModal' class='modal_trigger' data-info="+JSON.stringify(yourVar)+" data-toggle='modal'>Edit</a></td></tr>";

Answer 4

name , :

// using a mapping :
var infoMapping = {};

function createRow (name) {
    // this will work if 'id' is a key which identifies the object
    infoMapping[name.id] = name;
    var row2 = "<tr><td><a href='#editModal' ... data-infoid="+name.id+" ... ";
    // etc ...
}

function editModal (nRow) {
    var infoid = $(nRow).attr('data-infoid');
    var name = infoMapping[infoid];

    // use name ...
}

Answer 5

var x = {a:10, b:20};
var html = "<div data-info='" + JSON.stringify(x) + "'></div>";

"<div data-info='{"a":10,"b":20}'></div>"