dump jquery object in an alert box

Question

I am not quite adept in maneuvering jQuery, and it came to a point that I need to debug a program that was passed down from me without a documentation.

I have this var a, an object, that I really want to know the content of its collection. In my mind I need a function like foreach() in PHP to iterate over this object variable. Upon researching I end up in using jQuery.each(). Now I can clearly iterate and see what was inside var a.

However, it was kind of annoying to alert once every value on the var a. What I wanna know if it's possible to display all the contents in just one pop of alert box?

Here is my code:

$.each(a, function(index, value) { 
alert(index + ': ' + value); 
});

The var a contains infos such as:

creationdate: date_here
id: SWFUpload
modificationdate: date_here
type: .jpg
index: 0
name: uploaded_filename.jpg
size: size_in_bytes

BTW: The var a is called via file upload script.

Solution 1

Why don't you just accumulate the values in an array, then display the whole array (for instance, using JSON)? Example:

var acc = []
$.each(a, function(index, value) {
    acc.push(index + ': ' + value);
});
alert(JSON.stringify(acc));

In any case, I'd suggest using a debug tool like Firebug. So you could just use console.log(a) and be able to navigate freely through the objects's fields.

Solution 2

In firefox you could try:

alert(yourObject.toSource());

OR you could use some plugin: See: jQuery Dump Plugin

Comments

[planet x]

Great. As what I am looking for. Although the output was kind of gibberish to look at, still it's fine. Thanks!

[planet x]

Great suggestion regarding jQuery Dump Plugin.

[Yes Barry]

Nice! I totally didn't know about toSource() in FF. +1

[EralpB]

It is hard to get the console, i.e. when you are debugging an iOS7 mobile application on real device, so this helps.