Comparing html text inputs and redirecting to another page using Javascript

Question

I am brand new to Javascript and am just using it to make a simple website for fun. I have tried searching the web but am still stuck, so if you could help me or redirect me towards other help, that would be great. I am trying to use Javascript to send a user to another html page in my site if their input matches my criteria. So I wanted to use an if/else statement to do this: if the text input equals ODQHVHMJKD, it would send them to page3.html. However when I try this on the browser, nothing happens--it just takes me to an identical page with ?codebox1=f&button1=Submit at the end of the address. Here is my script section:

<script type="text/javascript">
function testResults (form) {
    if (form.codebox1.value == ODQHVHMJKD) {
    window.location.pathname = 'page3.html';
    }
    else {
        window.alert("Try again!");
    }  
};
</script>

Here are my form elements:

<form name="form1" method="GET">
<input name="codebox1" type="text" />
<input name="button1" type="submit" value="Submit" onClick="testResults(this.form)"/>
</form>

Can you help me so that I can get this to work? It's more than likely I've done everything completely wrong--any help is appreciated!

So I added return false and quotes. The alert box works but when I type the correct answer it still doesn't take me to the new page. Any suggestions? I've made sure I'm using the right file name. — Linda Norland
– Linda Norland, Commented Jun 6, 2014 at 3:04
I got it all to work! I was using window.open incorrectly. I changed it to window.open("page3.html"); and now everything seems to be just fine! — Linda Norland
– Linda Norland, Commented Jun 6, 2014 at 17:14

Rashmin Javiya · Accepted Answer · 2014-06-05 19:53:43Z

1

Try this,

function testResults (form) {
    if (form.codebox1.value == "ODQHVHMJKD") {
        window.location = 'page3.html';
    }
    else {
        window.alert("Try again!");
    }  
    return false;
};

answered Jun 5, 2014 at 19:53

Rashmin Javiya

5,2223 gold badges31 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Linda Norland Over a year ago

This works in that the alert box now shows up when I type in the wrong answer, but I'm still having trouble linking to the new page. I've triple checked that I'm using the right name, so I don't know why it's not working.

soktinpk · Accepted Answer · 2014-06-05 19:57:38Z

1

You need to prevent the default action of the form. In the submit event, call e.preventDefault(); or return false In addition, you need quotation marks around ODQHVHMJKD

Js Fiddle: http://jsfiddle.net/prankol57/Ht45t/

edited Jun 5, 2014 at 19:57

answered Jun 5, 2014 at 19:52

soktinpk

3,8982 gold badges24 silver badges34 bronze badges

Comments

user1454373 · Accepted Answer · 2014-06-05 22:59:10Z

0

Maybe this can help you.

    <form name="form" onsubmit="Results()">
    <input type="text" name="fname" id="val">
    <input type="submit" value="Submit">
    </form>

    <script type="text/javascript">
        function Results() {
          var val = document.getElementById('val').value;
          if (val == "ODQHVHMJKD") {
              window.location = 'page3.html';
           } else {
              window.alert("Try again!");
           }  
        };
    </script>

edited Jun 5, 2014 at 22:59

answered Jun 5, 2014 at 20:19

user1454373

3701 gold badge3 silver badges9 bronze badges

Collectives™ on Stack Overflow

Comparing html text inputs and redirecting to another page using Javascript

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related