Sending Multiple Items to MVC Controller via jQuery.Ajax

Question

If youa are serializing a form using something like jQuery, it will often map the JSON keys and values to the properties of a object on the Controller Action you are posting

Answer 1

dataType parameter in $.ajax method is the type of response (the type of data that you're expecting back from the server), not request. Try this instead:

function PostForm() {
    $.ajax({
        url: "/Home/TestMVC",
        type: "POST",
        dataType: "application/JSON",
        data: $('#form').serialize() + "&" + $('.additionalParams').serialize()
    });
};

or:

function PostForm() {
    $.ajax({
        url: "/Home/TestMVC" + "?" + $('.additionalParams').serialize(),
        type: "POST",
        dataType: "application/JSON",
        data: $('#form').serialize()
    });
};

UPDATED:

Try this:

Controller:

public void TestMVC(MyObject obj, String[] TheWeirdQueryString)
{
}

Client:

function PostForm() {
    $.ajax({
        url: "/Home/TestMVC",
        type: "POST",
        dataType: "application/JSON",
        data: $('#form').serialize() + "&" + $('.additionalParams').serialize()
    });
};

but on client side your additional params must be in the following format:

TheWeirdQueryString[0]=param1&TheWeirdQueryString[1]=param2&...&TheWeirdQueryString[n]=paramN

so $('.additionalParams') elements must have "id" and/or "name" attributes like: TheWeirdQueryString[1], TheWeirdQueryString[2] ... TheWeirdQueryString[N]

Hope this helps