Question

How might one pass a variable number of fields to .load()‘s second parameter? I am attempting to enhance my search with ajax, and have been following Symfony’s Jobeet tutorial. Unfortunately, in addition to the text field, I have a list of hidden fields I would like passed. I can’t serialise all of the form’s inputs, because I have to perform an operation on the text field first.

The function looks something like this:

$('#search').keyup(function(key)
{
  // do something to the value
  var query = this.value;

  $('#results').load(
    $(this).parents('form').attr('action'),
    // pass query along with all hidden fields
    { query: query, /* variable number of hidden input fields go here */ }
  );
}

One option might have been to serialise all fields but the ‘search’ input, append the modified query variable and pass that string. However, short of getting all fields and looping through them, creating the string manually, I’m not sure how to do that.

Answer 1

You can build the object in a loop:

var params = { query: query };
$('#form input[type="hidden"]').each(function() {
    params[this.name] = $(this).val();
});

$('#results').load(
    $(this).parents('form').attr('action'), params
);