Ajax form serialize doesnt bind when using multiple parameters in MVC Controller

Question

I have a view with multiple inputs for my Model (Html.TextBoxFor(x => x.attribute) etc. And my ajax method is:

function callMethod() {
    $.ajax({
        t         


        

Answer 1

you can do it like this:

function callMethod() {
    var number = 2;
    var sd = $('#Form').serializeArray();
    sd.push({ name:"test", value:number });

    $.ajax({
        type: "POST",
        data: sd,
        url: '@Url.Action("formMethod", "Test")',
    }).done(function (newTable) {
        $('#RefundTableDiv').html(newTable);
    });
};

Answer 2

Using .serialize() serializes your model as a query string (e.g. someProperty=someValue&anotherProperty=anotherValue&...). To add additional name/value pairs, you can append then manually, for example

var data = $('#Form').serialize() + '&test=' + number;
$.ajax({
    ....
    data: data;

or use the param() method (useful if you have multiple items and/or arrays to add)

 var data = $("#Form").serialize() + '&' + $.param({ test: number }, true);
 $.ajax({
    ....
    data: data;