Javascript dom parsing troubleshoot

Question

I create button from the string and add it to the DOM.

Here is javascript code :

var se = "";

Here is how button attached to the DOM:

 jQuery("#jqgrid").jqGrid('setRowData', ids[0], { act: se });

jqgrid - is id of some html element.

As you can see inside button I have onClick attribute that calls function named saveRow.

Here is the signature of the called function:

saveRow: function (rowid, successfunc, url, extraparam, aftersavefunc, errorfunc, afterrestorefunc) {}

One of the parameters that I pass to the saveRow function is json:

{'name':"content1"}

And her how the button looks in the DOM tree after page is loaded:

(sorry for small text)

As you can see DOM converted this parameter(in red frame):

{'name':"content1"}

to this:

'[Object object]'

Any idea why the JSON parameter converted to this [Object object]?

UPDATE:

Here how DOM is looks:

If I use this attitude:

se = "";

UPDATE2:

Here how DOM is looks:

If I use this attitude:

se="";

After the button is clicked I get this error:

Mosh Feu · Accepted Answer

That's because when you trying to add JSON as html it call the function toString() which return [Object object] like in this example.

var obj = {foo: 'bar'};

console.log(obj.toString());

By default, the toString() method is inherited by every object descended from Object. If this method is not overridden in a custom object, toString() returns "[object type]", where type is the object type.

_MDN

If you want to use your JSON convert it first to string using JSON.stringify

The JSON.stringify() method converts a JavaScript value to a JSON string

Like this:

var obj = {foo: 'bar'};

var a = "Do Something";

document.body.innerHTML += a;

function doSome(obj) {
  console.log(obj.foo);
}

Update 2

var cl = 198;

var se = "";

document.body.innerHTML += se;

jQuery.fn.saveRow = function() {
  console.log(arguments);
}

Javascript dom parsing troubleshoot

Answers (1)

Related Questions