serialize()
will only retrieve the name
and value
properties from an element.
To do what you require you can use serialize()
as normal, then append the selected option text to it:
var data = $('form').serialize() + '&attendText=' + $('select option:selected').text();
console.log(data);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<select name='attend'>
<option value="1" selected="selected">Question</option>
<option value="2">Attending</option>
<option value="3">not-attending</option>
</select>
</form>
If you wanted to use serializeArray()
you would need to push()
the data to the resulting object, like this:
var data = $('form').serializeArray();
data.push({
name: 'attendText',
value: $('select option:selected').text()
});
console.log(data);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<select name='attend'>
<option value="1" selected="selected">Question</option>
<option value="2">Attending</option>
<option value="3">not-attending</option>
</select>
</form>
</div>