How to deal with spaces in a PHP request

Question

Let's say you have two buttons. Their ids are:

bob
bobs burgers

You use jquery to .load a php page in a div element like follows:

var teamSelect = $(this).attr('id');
$("#loadTables").load("php/leagueTable.php?team="+teamSelect);

Now bob will run just fine, but bobs burgers has a space and does not work. The address ends up being

"php/leagueTable.php?team=bobs"

I have no control over the fact that there will be spaces in the button Ids. The buttons are generated from a database and these names will always have spaces. How can I deal with this?

Answer 1

You need to use encodeURIComponent to encode the url

$("#loadTables").load("php/leagueTable.php?team="+encodeURIComponent(teamSelect));

The encodeURIComponent() method encodes a Uniform Resource Identifier (URI) component by replacing each instance of certain characters by one, two, three, or four escape sequences representing the UTF-8 encoding of the character (will only be four escape sequences for characters composed of two "surrogate" characters), reference.

Answer 2

If these values doesn't contain quotes, then enclose these values with single quotes.

Like:

'bob'
'bob burgers'

So that when it will passed to the url it will be

php/leagueTable.php?team='bob'
php/leagueTable.php?team='bob burgers'

Then you can just strip them off afterwards with trim().

Answer 3

As per w3.org

The value must be unique amongst all the IDs in the element's home
subtree and must contain at least one character. The value must not 
contain any space characters.

You can find more here