jQuery: form serialize, hidden fields, and not displayed fields

DS_web_developer picture DS_web_developer · Feb 21, 2012 · Viewed 20.4k times · Source

I am using $(this).serialize() when submitting a form.

It works well, except in times when I (for some reason) have 2 fields with same name (one visible, and one not, and I am not talking about type="visible" but display:none)...

But of course serialize has no regard for this... it just takes them all.

I tried this

var $disabled_list = $(this).find('input:hidden,select:hidden,textarea:hidden').attr('disabled', 'disabled');
$(this).serialize();
$disabled_list.attr('disabled','');

and It is solving my problem, except the :hidden selector, takes also type="hidden"

what's the proper way?

Answer

Frédéric Hamidi picture Frédéric Hamidi · Feb 21, 2012

You do not have to call serialize() on the <form> itself, you can match some of its controls and call it on the resulting set. This allows you to avoid tinkering with disabled attributes.

Since you want controls matching :hidden only if they also actually expose the hidden type, you can use the following selector:

$(this).find("input[type='hidden'], :input:not(:hidden)").serialize();