Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

This may be a strange question. I'm trying to fuse two arrays together, but the read out is showing them as separate types of objects. The first type, gathered by the .serializeArray() jquery function is showing as this when I alert them:

[object Object]

The second, which I am getting from pushing each option in using a more JS way, shows as this:

[object HTMLOptionElement]

Here's my code below:

   incrCopy();
   enableSubmit();
   disableReset();

   var linkedInArray = [];
   $('form select option.linked-in').each( function() {
   linkedInArray.push(this);
   })
   //These alert the second way

   prevVals = $("form").serializeArray();
   //They alert the first way
   prevVals.push(linkedInArray);
   alert(prevVals);

Anyone have an idea on what I'm missing here?

share|improve this question
    
Okay, I'm not sure of the difference academically, but I realized when I called $(this) instead of 'this' in the each loop, the objects looked the same. –  streetlight Oct 25 '12 at 18:18
1  
I was just about to put that in as an answer. The HTML element doesn't become a jQuery object until wrapped in $() –  Michael Berkowski Oct 25 '12 at 18:19
3  
Well, serializeArray collects the values from the form fields and creates an array of objects (api.jquery.com/serializeArray). linkedInArray.push(this); directly adds the DOM element to the array. You are just doing two different things. –  Felix Kling Oct 25 '12 at 18:19
2  
You'll get better information if you use console.log, and console.dir via the developer console than you ever will via alert. –  zzzzBov Oct 25 '12 at 18:23
    
Array does not equal list in js. They are completely different structures. –  vdbuilder Oct 25 '12 at 18:25
add comment

1 Answer 1

up vote 2 down vote accepted

This is not a difference between jQuery and JavaScript. That is how serializeArray works. It doesn't return a list of HTML elements, it returns a list of plain-old-objects with name/value properties.

For example, were it to find something like this:

<input name="user[eye_color]" value="brown" />
<input name="user[age]" value="47" />

it would return an array of plain-old-objects, looking something like this:

[
  {
    name: "user[eye_color]",
    value: "brown"
  },
  {
    name: "user[age]",
    value: 47
  }
]

Conversly, your first loop iterates over a jQuery selector, where each element is a native HTMLElement of some kind (HTMLDivElement, HTMLInputElement, HTMLTableElement, etc).

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.