10

Having the data from serializeArray, how do you update the form with it?

var values = form.serializeArray();
form.deserializeArray(value); // What is the deserializeArray analogue?
form.seriaizeArray() === values; // So that this is always true
Dmytrii Nagirniak
  • 23,696
  • 13
  • 75
  • 130

4 Answers4

4

We can iterate over the array and restore the form.

for (var i = 0; i < values.length; i++) {
    $("input[name='" + values[i].name + "'], select[name='" + values[i].name + "']").val(values[i].value);
}
romaricdrigon
  • 1,497
  • 12
  • 16
Kaushik
  • 3,371
  • 3
  • 23
  • 32
  • 1
    This way work only for "text, textarea,single-select" Not for "radio, checkbox, multi-select" – wrivas Jan 28 '15 at 01:41
4

See jQuery plugin to serialize a form and also restore/populate the form

Community
  • 1
  • 1
Pavel Chuchuva
  • 22,633
  • 10
  • 99
  • 115
  • Yeah, that's similar to what I'm doing now. Was wondering if there's an official way of doing it from jQuery itself (or existing and maintained plugin). – Dmytrii Nagirniak Feb 21 '12 at 23:28
1

This work for me

// By Jorhel Reyes
jQuery.fn.deserializeArray = function (ObjectSerialized, isJson) 
{
    var $form = jQuery(this);
    var json = {};
        jQuery.each(ObjectSerialized, function(i, pair){
            var name = decodeURIComponent(pair.name).split("[");
            if( typeof name[1] != "undefined" ){
                if( typeof json[name[0]] === "undefined"){ json[name[0]] = []; }
                json[name[0]].push(decodeURIComponent(pair.value));
            }else{
                json[name[0]] = decodeURIComponent(pair.value);
            }
        });
    var asignValue = function(element, val){
        if( !element.length ){ return; }
        if (element[0].type == "radio" || element[0].type == "checkbox") {
            var $fieldWithValue = element.filter('[value="' + val + '"]');
            var isFound = ($fieldWithValue.length > 0);
            // Special case if the value is not defined; value will be "on"
            if (!isFound && val == "on") {
                element.first().prop("checked", true);
            } else {
                $fieldWithValue.prop("checked", isFound);
            } 
        } else { // input, textarea
            element.val(val);
        }
    };
    jQuery.each(json, function(name, value){
        var element = '';
        if( typeof value === "object" ){
            element = $form.find('[name="' + name + '[]"]');
            jQuery.each(value, function(k, val){
                var elm = jQuery( element[k] );
                asignValue(elm, val);
            });
        }else{
            asignValue($form.find('[name="' + name + '"]'), value);
        }
    });
    return this;
}
Jorhel Reyes
  • 113
  • 1
  • 8
  • It'd be helpful if you provide a brief explanation to accompany your code. Code-only answers are generally low quality answers without some sort of explanation of what it does. – Collin Barrett May 22 '18 at 15:45
-1

The opposite to serializeArray is .param()

In fact, the serialize function does a serializeArray first, and then applies param()

serialize: function() {
    return jQuery.param( this.serializeArray() );
},
serializeArray: function() {
...
thessoro
  • 9