Steven Steven - 5 months ago 19
Javascript Question

Disabled fields not picked up by serializeArray

(Question updated to reflect real issue)

I just realized that

serializeArray
is not fetching content from disabled fields.

A set of (street) address fields are populated by selecting an item from a
autosuggest
list. Once this is done, the fields are disabled. I could change this to
read only
, but I want the disabled look and feel without having to change CSS.

Is there a way to have
serializeArray
grab data fro, the disabled fields?

Solution

Thanks to Mohammad, I created a small plugin that helps me solve my issue:

(Fiddle)

var form_data = $('form').serializeAll();

(function ($) {
$.fn.serializeAll = function () {
var data = $(this).serializeArray();

$(':disabled[name]', this).each(function () {
data.push({ name: this.name, value: $(this).val() });
});

return data;
}
})(jQuery);

Answer

Try this

var data = $('form').serializeAllArray();

And here is the small plugin that is used

(function ($) {
  $.fn.serializeAllArray = function () {
    var obj = {};

    $('input',this).each(function () { 
        obj[this.name] = $(this).val(); 
    });
    return $.param(obj);
  }
})(jQuery);

You can also try enabling all your element's just to serialize them and then disable them after serializing.

var myform = $('#form');
var disabled = myform.find(':input:disabled').removeAttr('disabled');
var serialized = myform.serializeArray();
disabled.attr('disabled','disabled');
Comments