jQuery val() on dropdown returns value "Array"

Question

I'm stumped. I have a dropdown menu where a user selects an item.

<select name="rep-name" type="text" id="rep-name" size="" value="" >
    <option value></option>
    <option value="alex">alex</option>
    <option value="ben">ben</option>
    ...
</select>

The value is then retrieved...

$('#rep-name').val()

and sent to a database.

Usually it works fine but in some cases, it sends the value 'Array' to the database. Interestingly, in those cases, the serialize function on the form still gets the correct value of the item. So in other words:

$('#run-pma-form').serialize() // works fine
$('#rep-name').val() // fails

It works fine in ~95% of cases and unfortunately, I don't have info on what browsers are being used, etc when it incorrectly returns 'array.' I'm just wondering if anyone has run into this issue or has any clue why it might be happening.

Answer 1

$("#rep-name")[n].val() will get you the value of any given option, but it's not correct to think of a select menu as having a value—what you want is the value of the currently selected option.

http://api.jquery.com/selected-selector/

$("#rep-name option:selected").val() should work.