选择选项时，表单操作会更改

When a user searches and selects one of the departments it must take them to that specific page. So if music is selected it must take them to the music page or dvd page but only when they click on the search button to submit the search.

This is my form

<div id="form">
    <form id="searchbarid" name="Searchbar"  action="Searchdefault.php" method="get">
       <center>
          Search
          <input name="Search" type="text" dir="ltr" lang="en" size="50" />
          In <select name="SearchBy" dir="ltr" lang="en" id="searchbyid">
              <option value="All" selected="selected">All Departments</option>
              <option value="Music">Music</option>
              <option value="DVD">DVD's</option>
              <option value="Bluray">Bluray</option>
          </select>
          <input type='submit' name="Submit" value="Search"/>
        </center>
    </form>

Unfortunatly I have read this can be done with JavaScript and I know absolutly nothing about JavaScript. If JavaScript is the best way to do this please explain it to me.

If it can be done with PHP I would be happier as I know more about PHP.

EDIT:

Ok so I tried the javascript and it didn't work

This was in the head of my doc.

<SCRIPT language="JavaScript">
    function goto(form) { 
        var index=form.select.selectedIndex
        if (form.select.options[index].value != "0") {
            location=form.select.options[index].value;}
        }
</SCRIPT>

And this was My search (Note I only changed the value of Music to see if it would work)

<div id="form">
    <form name="Searchbar" >

    <center>

  Search
<input name="Search" type="text" dir="ltr" lang="en" size="50" />


      In <select name="SearchBy" dir="ltr" lang="en" id="searchbyid" onchange="goto(this.form)" >
          <option value="All" selected="selected">All Departments</option>
          <option value="/Echos Online/Music.php">Music</option>
          <option value="DVD">DVD's</option>
          <option value="Bluray">Bluray</option>
        </select>
  <input type='submit' name="Submit" value="Search" />

    </center>
    </form>

 </div>

Can Someone please piont out what I'm doing wrong

Many Thanks to everyone so far for there help and any more help will be greatly apprieciated

AThere are a number of ways you can do this. If you are more comfortable with PHP then get the form to submit to a php page that based on the value of "SearchBy" redirects the person to the right place.

example:

if ($_GET['SearchBy'] == Music){

    header( 'Location: http://www.yoursite.com/music.html' ) ;

}

You probably want to use a switch case statement rather than if but you should get the idea from this.

If you want to try Javascript you could use an "OnChange" function and turn the select into what is sometimes called a Jump Menu. If found an example for you here:

http://www.web-source.net/javascript_redirect_box.htm

but effectively, this is an idea of how it could work:

<SCRIPT language="JavaScript">
    function goto(form) { 
        var index=form.select.selectedIndex
        if (form.select.options[index].value != "All") {
            location=form.select.options[index].value;}
        }
</SCRIPT>

<SELECT name="SearchBy"  onChange="goto(this.form)">
      <OPTION value="All" selected="selected">All Departments</OPTION >
      <OPTION value="http://www.yoursite.com/music.html">Music</OPTION >
</SELECT>

I hope this sends you in the right direction. Try it out.

You can only do this with javascript. You can use the onchange method that triggers an action when you select an item of the select list. This action will submiting the form.

Use :

<select name="SearchBy" dir="ltr" lang="en" id="searchbyid" onchange="this.form.submit()">

This is the easiest way to submit the form.

To redirect to the good page, you need do a redirection at the top of your Searchdefault.php script. You can do that like this

<?php
if(isset($_GET['SearchBy'])) {
    switch($_GET['SearchBy']) {
        case 'Music': 
        header('Location: URL_OF_MUSIC_PAGE');
        break;
        case 'DVD': 
        header('Location: URL_OF_DVD_PAGE');
        break;
        //...
        default:
        header('Location: URL_OF_A_DEFAULT_PAGE');
    }
}

If you want them to have to click on the search button then this is probably easier to do with PHP than with JavaScript (and will work even on non-JS browsers, too).

In Searchdefault.php, do a conditional (e.g. switch or if statement) based on the value of $_GET['SearchBy'] and issue an appropriate header() call to trigger a browser redirect.