How to dynamically pass data parameter in a jquery ajax call (multiple arrays of data)

Question

I have this ajax code:

return $.ajax({
        type: "POST",
        url: "somefile.php",
        cache:false,
        data: { "yfilter": $("#yearFilter").serializeArray(),
            "gfilter": $("#genreFilter").serializeArray() },
        dataType:"json",
        success: function(data){
            alert("success");
        }

This works fine, but I need to pass the data parameter dynamically. For now I need the above data parameter content and a single string.

How do I pass this dynamically? / How do I store it in a variable and pass it to the "data:" field?

 { "yfilter": $("#yearFilter").serializeArray(),
    "gfilter": $("#genreFilter").serializeArray() }

I tried JSON.stringify I I couldn't get it to work probably due to the data being an array.

The year and genre arrays are coming directly from the jquery drop down menu. It is selected like by it's #id like so "$("#yearFilter")". This is the select form element.

<select multiple="multiple" name="yearFilter[]" class="filterChange" id="yearFilter">

What I need at the base level is:

var someData = "";


    if(...){
        someData = { "yfilter": $("#yearFilter").serializeArray(),
                "gfilter": $("#genreFilter").serializeArray() };
    }
    else if(...){
        someData = "sampleString";
    }

And in ajax call:

...
data: someData,
...

Answer 1

I think I have an idea what you want but post has been overly complicated by extraneous issues like json stringify . Here's a function that could be used in several places eleswhere in your code to make one type of AJAX call or another.

You would then perhaps have several buttons and call the function within handlers for each type of button and change the argument passed to function

doAjax('someval');/* use in button 1*/
doAjax('someOtherval');/* use in button 2*/



function doAjax(arg) {

    var someData = "";
    if (arg == 'someval') {
        someData = {
            "yfilter": $("#yearFilter").val(),
            "gfilter": $("#genreFilter").val()
        };
    } else {
        someData = "sampleString";
    }

    $.ajax({
        type: "POST",
        url: "somefile.php",
        cache: false,
        data: someData,
        dataType: "json",
        success: function(data) {
            if (arg == 'someval') {
                alert("success 1");
            } else {
                alert("success 2");
            }
        }
    })
}

Answer 2

Hope I've understood what you're asking for. You could do something like this:

var parameters = {};
if (...) {
    parameters = $("#yearFilter").serializeArray();
}
if () {
    parameters = $("#genreFilter").serializeArray();
}

and then replace the line:

parameters: { "yfilter": $("#yearFilter").serializeArray(),
              "gfilter": $("#genreFilter").serializeArray() },

with:

data: parameters,