HTML/JavaScript Redirect

Question

I have this code where i want to redirect the same page to a new html page but i cant just do it. The code is for form The html page is with me please help

<form class="white-pink" align="center" name="myForms" method="post">
            <h1>Search Form 
                    <span>Please Find the car in the fields.</span>
                </h1>
                <label>
                    <span>Search Car :</span> 
                <select name="cars">
                    <option value="def" disabled="disabled" selected="selected">Please select a name</option>       
                    <option value="honda">Honda</option>
                    <option value="hyundai">Hyundai</option>
                    <option value="volkswagon">VolksWagon</option>
                    <option value="toyota">Toyota</option>
                </select>
            </label>

            <label> 
                    <input type="submit" name="s1" value="Search" class="button" onclick="validateForm();"/>
            </label>
        </form>

and for the javascript:

<script>
        function validateForm()
        {       var x=document.forms["myForms"]["cars"].value;
                switch (x)
                {
                    case "def":
                        alert("Please choose a Car Compony");
                            break;
                    case "honda":
                            window.location = "honda.html"; 
                        return false;
                            break;
                    case 2:
                            x="Today is Tuesday";
                            break;
                    case 3:
                            x="Today is Wednesday";
                            break;
                    case 4:
                            x="Today is Thursday";
                            break;
                }


        }
    </script>

there is a drop down list for which after selecting the value i redirect to the required html page

Duplicate: http://stackoverflow.com/questions/503093/how-can-i-make-a-redirect-page-in-jquery-javascript — Justinas, Apr 25 '14 at 07:02
how is that a duplicate? those questions are completely unrelated. — Banana, Apr 25 '14 at 07:03

score 0 · Answer 1 · answered Apr 25 '14 at 07:04

I think you want the form not to be submitted. You can achieve it by using type="button" for the button instead of type="submit"

Or you can do it using JS

<script>
        function validateForm(e)
        {       
                e.preventDefault();
                var x=document.forms["myForms"]["cars"].value;
                switch (x)
                {
                    case "def":
                        alert("Please choose a Car Compony");
                            break;
                    case "honda":
                            window.location = "honda.html"; 
                        return false;
                            break;
                    case 2:
                            x="Today is Tuesday";
                            break;
                    case 3:
                            x="Today is Wednesday";
                            break;
                    case 4:
                            x="Today is Thursday";
                            break;
                }


        }
    </script>

score 0 · Accepted Answer · answered Apr 25 '14 at 07:05

after selecting the value i redirect to the required html page - Try this, Added onchange="window.location.href=this.value;"

            <select name="cars" onchange="window.location.href=this.value;">
                <option value="def" disabled="disabled" selected="selected">Please select a name</option>       
                <option value="yourpath/honda.html">Honda</option>
                <option value="hyundai.html">Hyundai</option>
                <option value="volkswagon.html">VolksWagon</option>
                <option value="toyota.html">Toyota</option>
            </select>

score 0 · Answer 3 · answered Apr 25 '14 at 07:14

Check it:

<html>
<head> Sample page </head>
<body>
<form class="white-pink" align="center" name="myForms" method="post">
            <h1>Search Form 
                    <span>Please Find the car in the fields.</span>
                </h1>
                <label>
                    <span>Search Car :</span> 
                <select name="cars">
                    <option value="def" disabled="disabled" selected="selected">Please select a name</option>       
                    <option value="honda">Honda</option>
                    <option value="hyundai">Hyundai</option>
                    <option value="volkswagon">VolksWagon</option>
                    <option value="toyota">Toyota</option>
                </select>
            </label>

            <label> 
                    <input type="button" name="s1" value="Search" class="button" onclick="validateForm();"/>
            </label>
        </form>
<script>
        function validateForm()
        {       var x=document.forms["myForms"]["cars"].value;
                switch (x)
                {
                    case "def":
                        alert("Please choose a Car Compony");
                            break;
                    case "honda":
                            window.location.href = "http://www.honda.com"; 
                            break;
                    case "hyundai":
                            window.location.href = "http://www.hyundai.com"; 
                            break;
                    case "volkswagon":
                            window.location.href = "http://www.volkswagon.com"; 
                            break;
                    case "toyota":
                            window.location.href = "http://www.toyota.com"; 
                            break;
                }
        }
    </script>
</body>
</html>

the location are .html files – user2500367 Apr 25 '14 at 07:21 — user2500367, Apr 25 '14 at 07:21
Replace: window.location.href = "test.html"; :) – anik4e Apr 25 '14 at 07:26 — anik4e, Apr 25 '14 at 07:26

HTML/JavaScript Redirect

3 Answers3