0

My goal is to have an input box on a page so that when a word is inputed it will send the user to that part of the website.

For example;

If the user enters the word banana and presses GO button, the page www.mysite.com/banana is loaded

If they enter apple it goes to www.mysite.com/apple etc

Could anyone show me the neatest way of doing this? Or at least point me to somewhere that could teach me - I am still fairly new to HTML and I am struggling to succesfully search this to find an answer.

(I also need to go to a default this page does not exist for inputs that do not find a page, but thats a follow on problem)

vjy
  • 1,184
  • 1
  • 10
  • 24

3 Answers3

0

By adding the text and URL you can redirect the user.

<input type="text" id="search_page" onclick="searchTextPage();" />

<script type="text/javascript">
    function searchTextPage(){    
       var searchText = $(#search_page").val();
       window.location = window.location + '/' + searchText;   
    }
</script>

For rescue the page, you have to put some condition about the searching the text.

Rubyist
  • 6,486
  • 10
  • 51
  • 86
0

For the textbox you can just use:

<input type="text" name="something" size="50" id="naam" />
<input type="submit" value="Send">

Then you could use the PHP header function to redirect:

<?php
if( $_POST)
{

$text   = $_POST['something'];

header("Refresh: 0;url=www.mysite.com/$text");

}
?>

Also be sure that the header must be invoked before any output is made. Otherwise the call fails. Take a look at this answer for more info.

Community
  • 1
  • 1
Daanvn
  • 1,254
  • 6
  • 27
  • 42
0

Here's sample HTML:

<form action="javascript:void(0);" onsubmit="goToURL();">
    <input id="urlInput" type="text" />
    <input id="urlSubmit" type="submit" value="Go to URL"/>
</form>

And JavaScript:

function goToURL() {
    var urlInput = document.getElementById("urlInput").value;
    window.location += "/" + urlInput;
}

Then (if you're using a server using a web.xml), specify your error page in there:

<error-page>
    <location>/general-error.html</location>
</error-page>

And if you want to tackle 404's in particular, use this in your error-page:

<error-code>404</error-code>

Note: I didn't verify if this works.

Pieter VDE
  • 2,195
  • 4
  • 25
  • 44