jQuery BBQ includes a powerful jQuery.deparam method that is capable of fully deserializing not only any params string that jQuery.param can create, but that PHP and Rails (and hopefully everything else) can create. And even though only the query string is being parsed this example, methods for parsing a params string out of the fragment (hash) as well parsing any stand-alone params string are included. jQuery BBQ can also be used to merge params from multiple URLs or objects into a new URL, even within element attributes. See the documentation for a full list of methods!

Sample query strings for you to click:

  1. Arrays encoded like this won't work as-expected in PHP / Rails, but work in BBQ and many older server-side frameworks (jQuery 1.3.2 or older $.param, jQuery 1.4 with $.param.traditional = true):
  2. Arrays encoded like this will work as-expected in PHP / Rails / BBQ (jQuery 1.4 or newer $.param):
  3. jQuery BBQ and PHP can handle non-shallow arrays, but Rails (rack) cannot (jQuery 1.4 or newer $.param):
    ?a[]=0&a[1][]=1&a[1][]=2&a[2][]=3&a[2][1][]=4&a[2][1][]=5&a[2][2][]=6&a[3][b][]=7&a[3][b][1][]=8&a[3][b][1][]=9 &a[3][b][2][0][c]=10&a[3][b][2][0][d]=11&a[3][b][3][0][]=12&a[3][b][4][0][0][]=13&a[3][b][5][e][f][g][]=14 &a[3][b][5][e][f][g][1][]=15&a[3][b][]=16&a[]=17
  4. Some simple implicitly non-string values that BBQ can optionally coerce:
  5. More nested data structures. Since the arrays are shallow, this works in Rails (rack).

Urldecoded query string

Query string params, as parsed by jQuery BBQ (and converted to JSON)


$.deparam.querystring( true );

GET params, as parsed by PHP

print_r( $_GET );


The code

  // Values are not coerced.
  var params = $.deparam.querystring();
  debug.log( 'not coerced', params );
  $('#deparam_string').text( JSON.stringify( params, null, 2 ) );
  // Values are coerced.
  params = $.deparam.querystring( true );
  debug.log( 'coerced', params );
  $('#deparam_coerced').text( JSON.stringify( params, null, 2 ) );
  // Highlight the current sample query string link
  var qs = $.param.querystring();
  $('li a').each(function(){
    if ( $(this).attr( 'href' ) === '?' + qs ) {
      $(this).addClass( 'current' );