HTML nav menu/form list that redirects on button click -

HTML nav menu/form list that redirects on button click -

here i'm trying do, , sense though maybe i'm overthinking it. can create dropdown nav list, need combine 2 different dropdown lists give user options, when click button send them page corresponds choices.

for example, dropdown list one: type of advice need? -career -relationships -health droplist two: layout want? -quick , dirty -standard -in-depth

then need programme in link every combination of these pages. how programme in right redirects depending on selections?

assuming have pair of drop-down menus this:

<form method="post"> <p>what type of advice need? <br><select id="s1"> <option>career</option> <option>relationships</option> <option>health</option> </select> <p>what layout want? <br><select id="s2"> <option>quick , dirty</option> <option>standard</option> <option>in-depth</option> </select> <input type="button" onclick="send(this.form)" value="send"/> </form>

the button @ end of form, when clicked calls function redirect page want comparing items selected in each menu. function should receive reference form (passed in this.form), selected indexes , text (or values, if utilize them in each option) , test them in condicional branch:

function send(form) { var s1 = document.getelementbyid("s1"); var s2 = document.getelementbyid("s2"); var choice1 = s1.options[s1.selectedindex].text; var choice2 = s2.options[s2.selectedindex].text; if (choice1 == "career" && choice2 == "quick , dirty") { location.href = "http://quickdirtycareers.com"; } else if (choice1 == "career" && choice2 == "standard") { location.href = "http://standardcareers.com"; } else { location.href = "http://careers.stackoverflow.com"; } }

here's fiddle working sample: http://jsfiddle.net/helderdarocha/tnz9a/

(there many other ways it, adding css, dynamic selection, focus, etc. it's easier add together these enhancements using jquery.)

html nav