Take the 2-minute tour ×

I have a products page which displays 10 products a page. The GET variabel &perpage=10 changes the amount of results per page. I've made a SELECT dropdown to choose between different amounts of results per page.

Whenever this selection box is changed, &perpage=NEWVALUE should be added to the CURRENT URL.

How is this done?

share|improve this question
whathaveyouttried.com –  Some Guy Aug 27 '12 at 16:51
add comment

6 Answers

up vote 1 down vote accepted

The only ways to modify the current URL is with hashtags (#) and window.history.replaceState, both of which don't actually reload the page. These methods do dispatch change-events that you could listen-for and, using ajax, re-query a backend script to get results, however - this may be a bit more than what you actually need.

What you'll want to do, most likely, is have your form (with the select-menu) re-submit the form back to the current page. Something like:

<form action="" method="GET">
    <select name="perpage" onchange="this.form.submit()">
share|improve this answer
Slight correction on this - cross-browser you are correct - but you can modify the URL without a refresh or a #hashtag in Webkit browsers by using window.history.replaceState. It is a contested feature though so only a minute grumble :) Perfectly correct other than that. –  pebbl Aug 27 '12 at 17:01
@pebbl, correct - but it's also the same as using a # in the regards that it doesn't actually re-query the page; it only replaces the browser's history of the current page. Navigating "back" to it will work, but not during the current instance. –  newfurniturey Aug 27 '12 at 17:14
yep, I know, it was just because you stated 'the only way' that my critique voice kicked in... what you state is utterly correct. –  pebbl Aug 27 '12 at 17:20
@pebbl You win this round, and again are correct =P; I've updated my wording to include window.history.replaceState as well =] ..Thanks for the tip! –  newfurniturey Aug 27 '12 at 17:29
add comment

Well, just location.href += "&perpage="+newvalue (with appropriately-defined newvalue from the <select> value) would work, but after a while you'll get something like


So you really should do something more like:

location.href = location.href.replace(/([?&])perpage=\d+/,"$1perpage="+newvalue);
share|improve this answer
add comment

You can't modify a URL like you describe without reloading the page. (Assuming you don't want to reload the page)

See jquery: change the URL address without redirecting? for a more complete explanation, and how to do some something similar with a hash.

share|improve this answer
add comment

This will append the query string to the current location and the window will navigate to it

share|improve this answer
add comment

In PHP, JavaScript?

<form method="get">
    <select name="perpage">

Using the GET method will post the perpage value to your url, and it will reload your page (set your action="someurl" if you want it to go to another page).

share|improve this answer
add comment

Assuming you're asking how to do this on the server side (your question doesn't state), here's one way to do what you want:

$parts = parse_url($url); # parse the URL into its component parts
if (isset($parts['query'])) {
    parse_str($parts['query'], $qs); # split query string into parts
} else {
    $qs = array();
$qs['perpage'] = $NEWVALUE; # add param to array
$parts['query'] = http_build_query($qs); # build query string from array

# then, using `unparse_url()` from 
# http://www.php.net/manual/en/function.parse-url.php#106731
# you rebuild the URL:

$url = unparse_url($parts);

# For reference, here's `unparse_url()`:

function unparse_url($parsed_url) { 
  $scheme   = isset($parsed_url['scheme']) ? $parsed_url['scheme'] . '://' : '';
  $host     = isset($parsed_url['host']) ? $parsed_url['host'] : ''; 
  $port     = isset($parsed_url['port']) ? ':' . $parsed_url['port'] : ''; 
  $user     = isset($parsed_url['user']) ? $parsed_url['user'] : ''; 
  $pass     = isset($parsed_url['pass']) ? ':' . $parsed_url['pass']  : ''; 
  $pass     = ($user || $pass) ? "$pass@" : ''; 
  $path     = isset($parsed_url['path']) ? $parsed_url['path'] : ''; 
  $query    = isset($parsed_url['query']) ? '?' . $parsed_url['query'] : ''; 
  $fragment = isset($parsed_url['fragment']) ? '#' . $parsed_url['fragment'] : '';
   return "$scheme$user$pass$host$port$path$query$fragment"; 

See http://www.php.net/manual/en/function.parse-url.php#106731

share|improve this answer
It looks to me like you've answered a different question to what the OP was asking. The server-side part is already functioning, it's the front-end posting/getting of the value they are having difficulties with. –  pebbl Aug 27 '12 at 17:06
You may be right, but the OP did tag it with the php tag. –  Ross Smith II Aug 27 '12 at 17:50
add comment

Your Answer


