How to change search url produced by ‘s GET method?

My question are these.

  1. What is %5B%5D ?
  2. How can I change the url like this

    http://localhost:5757/alpool/?alp-search=true&cat_s=358,399

  1. %5B and %5D are percent-encoded/URL-encoded version of the [ (left square bracket) and ] (right square bracket) characters, respectively. See Percent-encoding reserved characters on Wikipedia.

  2. You can “change” it using JavaScript, and here’s an example of how you can do that without making major changes to the form markup that you currently have:

    • The only change you need to do is add alp-search-form to the class attribute of the form. The rest can/should remain the same.
    • This method works both with and without JavaScript; but of course, without JavaScript, you’ll get the “ugly” URL having those URL-encoded square brackets.

The JS Script

jQuery( function( $ ) {
  $( '.alp-search-form' ).on( 'submit', function( e ) {
    e.preventDefault();

    var url = $( this ).attr( 'action' ),
      cat_ids = $( 'select[name="cat_s[]"]', this ).val() || [],
      s = /\?[a-z0-9]+/i.test( url ) ? '&' : '?';

    url += s + 'alp-search=true';
    url += '&cat_s=" + cat_ids.join( ",' );

    // "Submits" the form.
    //location.href = url; // Uncomment after done testing.
    alert( url );          // Remove this after done testing.
  } );
} );

Demo on JS Bin

Additional Note

In the PHP script/function that processes the form data (or handle the search), you can use this snippet (which uses the wp_parse_id_list() function in WordPress) to grab the selected category IDs:

// This variable will/should always be an array.
$cat_ids = isset( $_GET['cat_s'] ) ?
    wp_parse_id_list( $_GET['cat_s'] ) : array();