ReynierPM ReynierPM - 8 days ago 5
Ajax Question

Form submitted trough AJAX doesn't serialize all the components, why?

I have the following HTML form:

<form id="some_id">
<select id="select1">...</select> // this turns in a Select2 component
<select id="select2">...</select> // this turns in a Select2 component
<select id="select3">...</select>
<input type="text" name="inp1" id="inp1" />
</form>


I am trying to send it over AJAX as follow:

$.ajax({
type: 'post',
url: '/save',
data: $('#new_component_restriction').serialize(),
success: function () {
alert('form was submitted');
}
});


But surprise only the input is sent on the POST request, why? I am missing something here? Do I need to get the values of the SELECT and sent along?

Answer

According to the jQuery serialize() documentation:

For a form element's value to be included in the serialized string, the element must have a name attribute.

So you should add name="something" to all your select elements. It's a bit odd that it does send the 'input' element though.