My question are these.
- What is %5B%5D ?
How can I change the url like this
http://localhost:5757/alpool/?alp-search=true&cat_s=358,399
-
%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. -
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 theclass
attribute of theform
. 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 only change you need to do is add
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.
} );
} );
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();