jquery serializeArray doesn't work in Safari

Question

I'm trying to use JQuery's serializeArray method to create an array of objects from a simple form (get data from a form and cache to be use later):

<fieldset class="myFieldset">
    <div id="divContainer">         
        <div class="anotherdiv">
            <input type="text" name="testBox1" class="aclass" />
            <select name="testSel1" class="atestclass">
                <option value="car">car</option>
                    <option value="boat">boat</option>
                    <option value="plane">plane</option>
                </select>
            </input>
         </div>
     </div>
 </fieldset>
 <fieldset class="submit-wrap">
        <input type="submit" name="enter" id="enter" value="Enter" >
 </fieldset>

I'm invoking the serializeArray on click:

$('#enter').click(function(){       
    var testForm = jQuery('.myFieldset').serializeArray();
    alert(testForm);
});   

This works fine in chrome (http://jsfiddle.net/pCELZ/), but not in Safari. Any ideas?

//My form elements are not disabled and I include the 'name' attribute. Tried various html... //Thanks in advance.

Answer 1

instead using fieldset use form:

<form class="myFieldset">
  <div id="divContainer">         
    <div class="anotherdiv">
        <input type="text" name="testBox1" class="aclass" />
        <select name="testSel1" class="atestclass">
            <option value="car">car</option>
                <option value="boat">boat</option>
                <option value="plane">plane</option>
            </select>
        </input>
     </div>
   </div>
 </form>

and test it here: fiddle

Answer 2

Jai is correct. Another way to do this is to specify the element by changing your selector.

$('#enter').click(function(){       
    var testForm = jQuery('.myFieldset :input').serializeArray();
    console.log(testForm);
});

Working fiddle here