How to dynamically pass data parameter in jQuery ajax call (multiple data arrays)

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. At the moment, I need the specified content of the data data and one row.

How to transfer it dynamically? / How to save it in a variable and transfer it to the "data:" field?

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

I tried JSON.stringify I could not get it to work, probably due to the data being an array.

Annual and genre arrays come directly from the jquery dropdown menu. It is selected as #id in the same way as "$ (" # yearFilter ")". This is an element of the selected shape.

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

What I need at a basic level:

 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 the post was overly complicated by extraneous issues like json stringify. Here is a function that can be used in several eleswhere places in your code to create one type of AJAX call or another.

Then you could have several buttons and call a function in handlers for each type of button and change the argument passed to the 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

I hope I understand what you are asking. You can 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, 

Answer 3

The JSON type should be the best option for dynamic data. click any data you want to see inside json as shown below. Therefore, create your json dynamically and send as ajax data.

 var employees = { accounting: [], dept: "HR" }; employees.accounting.push({ "firstName" : item.firstName, "lastName" : item.lastName, "age" : item.age }); $.ajax({ url: POSTURL, type: 'POST', dataType: 'json', data : employees, contentType: 'application/json; charset=utf-8', success: function (results) { }, error: function (results) { jQuery.error(String.format("Status Code: {0}, ", results.status, results.statusText)); } }); 

Answer 4

Try:

 someData = JSON.stringify({ yfilter: $("#yearFilter").val(), gfilter: $("#genreFilter").val() }); 

It will work.