Send form input value to URL

Question

I have a simple search form:

<form method="get" action="">
<input id="search" placeholder="Search" type="search" name="search"></input>
</form>

I want to get the value from "search" and have it show up in the url like this:

http://domain.ca/blog/search/searchterm

So if a visitor searches for "kubrick", they'll get a URL like:

http://domain.ca/blog/search/kubrick

I can't use PHP. Is there a Javascript solution?

Answer 1

You may try a javascript redirection for onsubmit event. To avoid empty searches, use the attribute "required" for the input.

Example:

<form onsubmit="window.location = 'http://domain.ca/blog/search/' + search.value; return false;">
<input id="search" placeholder="Search" type="search" name="search"></input>
<input type="submit" value="Send">
</form>