Using Jquery $getJSON How do I dynamically create data for the [data] parameter after Url param?

Question

I have no problems getting the Json to work and parse the json return. I was just wondering how I could build a dynamic "whatever data is" and stick it into [data] to pass my parameters from there and not manually append them to the url.

From jquery website example:

$.getJSON("test.js", { name: "John", time: "2pm" }, function(json){
     alert("JSON Data: " + json.users[3].name);
});

I thought I could build a string ( which doesn't make sense anyway ) and drop it inside the { }, but I obviously don't understand that part.

name: isn't a string and you can't put a variable in that part, so how would I dynamically put items into whatever [data] is.

UPDATE: Thanks for the answers. Would I be able to remove a parameter name from the object if I didn't find a valid value later on or would I need to destroy it and recreate it? I am using some select boxes to choose things and I may not have something selected so I wouldn't want to pass that parameter name/value.

Answer 1

You can build your object like this:

var someVar = someRandomString();
$.getJSON('test.js', (function() {
  var theData = {};
  theData[someVar] = someRandomValue();
  return theData;
})(), function(jsonStuffFromServer) {
  alert("JSON Data: " + jsonStuffFromServer.users[3].name);
});

Of course you don't have to build up the "data" object right there in an anonymous function; you can do it separately beforehand:

var theData = {};
theData[someVariableWithANameInIt] = someRandomValue();
$.getJSON(url, theData, function(jsonStuff) { ... });

Here's how you could build up such an object from a set of <select> elements on your page:

var theData = {};
$('#myForm select').filter(function() { return $(this).val() != ''; })
  .each(function() {
    theData[this.name] = $(this).val();
  });

$.getJSON(url, theData, function(jsonStuff) { ... });