The Right Word Redirects to Corresponding Page

Question

I'd like to achieve the following with javascript:

When you type any of the following words into the inputbox and click the submit button you'll be redirected to the corresponding page:

tree => tree.php
chocolate => chocolate.php
bird => bird.php
candle => candle.php
apple => apple.php

However if you type a different word than the above, you'll get a warning message.

<div id="main">
  <form action="">
    <ul>
      <li><input class="inputbox" type="text" name="TypeWord" value="" placeholder="Type a word here"/></li>
      <li><input class="button" type="submit" name="Submit" value="Submit word"/></li>
    </ul>
  </form>
</div>

<div id="warning">
  <p style="visibility:hidden;">Oops, wrong word, please try again.</p>
</div>

Does anyone know of a javascript that can do this? Any help is much appreciated! :)

Answer 1

If your just using pure javascript see this fiddle:

var VArray = ["tree", "chocolate", "bird", "candle", "apple"];

see the code for yourself there but its easier to put everything you want to validate into an array and loop through that array.