Getting all values being sent to the server at once

Question

I have a form, bunch of inputs and submit button. Some of the inputs are added and deleted dynamically. And some of them may be (or may not) disabled but I still need to get their values of the server.

So I have to add a handler to the button and collect the values of the disabled inputs manually and add them up to other, enabled. inputs. But I'd like not to go that way as it seems too complex (since some of the inputs are added / removed dynamically).
I can also add hidden inputs for each inputs which can be disabled but still it's a bit complex.
What I want is similar to 1. But instead of manually enumerating the enabled inputs by jquery selectors, I want to just get all values are being sent to the server at once by some jquery function maybe or by any other way. And then manually (by selectors) add up the values from the disabled inputs to them. Is this possible?

score 0 · Accepted Answer · edited May 23 '17 at 10:32

0

You could use the jQuery .serialize() for that.

The general structure of the function would look something like this

var mydata = $("#myform").serialize();
$.ajax({
    type: "POST",
    url: "ajaxurl",
    data: mydata,
    dataType: "json",
    success: function(data) {
        ...
    }
});

So I just figured you had a problem of how to get the disabled fields as well. You could use the function suggested in this thread:

Disabled fields not picked up by serializeArray

Just to make the answer complete, I will copy the plugin from there.

The usage is like this:

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

And here's the plugin itself:

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

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

edited May 23 '17 at 10:32

Community

1
1

answered Jul 11 '14 at 01:04

Artur K.

3,263
3
38
54

how do you get "mydata"? – Incerteza Jul 11 '14 at 01:05
@AlexanderSupertramp - It's the first line. Note you would need to check if `$.serialize()` would add `disabled` element values; I would guess not, so in that case you would need to add it to `mydata` manually. For clarity, `$.serialize()` creates a *url-encoded* string, not a JSON string; see the link to the manual for an example (at the bottom in red text). – Jared Farrish Jul 11 '14 at 01:10
`Serialize` excludes disabled elements. – PeterKA Jul 11 '14 at 01:12
That's going to serialize all form elements, not just `input`s? Also, `$(this).val()` could just as easily be `this.value` in the `$.each()`. – Jared Farrish Jul 11 '14 at 01:16
why "serializeAllArray", not "serialize"? – Incerteza Jul 11 '14 at 06:16

score 0 · Answer 2 · answered Jul 11 '14 at 01:04

0

You could use a strategy like the following in your submit handler:

Select all disabled elements .. (don't lose the reference to these)
Enable all disabled elements
Serialize the form .. to get all the data
Disable the elements back
Submit your form.

answered Jul 11 '14 at 01:04

PeterKA

24,158
5
26
48

this seems complex, even an user will be notice enabling / disabling the elements. – Incerteza Jul 11 '14 at 01:06
More complex than manually getting the values? Enabling/disabling takes only a fraction of a millisecond as you will not be doing it one by one..... well ..... – PeterKA Jul 11 '14 at 01:09

Getting all values being sent to the server at once

2 Answers2