How to make a simple JavaScript redirection based on submitted form value?-CodePudding

I want to define 4 arrays with specific postal codes for each location, and then based on a postal code (value of a user-submitted form) I want to redirect user to a new location.

I have no idea what I am doing wrong (I am not a coder).

I am trying to do something like this, but it doesn't work:

<!DOCTYPE html>
<script>
function sprawdzKody() {

const mokotow = ["00-807", "00-808", "00-809"];
const ursynow = ["01-807", "01-808", "01-809"];
const targowek = ["02-807", "02-808", "02-809"];
const wesola = ["03-807", "03-808", "03-809"];

var kodPocztowy = document.getElementById("kodPocztowy").value;

if(mokotow.includes(kodPocztowy)){ 
   window.location.href = "https://mokotow.geishasushi.pl";
} 
else if(ursynow.includes(kodPocztowy)){ 
   window.location.href = "https://ursynow.geishasushi.pl";
} 
else if(targowek.includes(kodPocztowy)){ 
   window.location.href = "https://targowek.geishasushi.pl";
} 
else if(wesola.includes(kodPocztowy)){ 
   window.location.href = "https://ursynow.geishasushi.pl";
} 
else { 
  window.location.href = "http://geishasushi.pl/jestes-poza-rejonem";
}
}
</script>


<form onsubmit="return sprawdzKody();" >
    <label for="kodPocztowy"> Kod Pocztowy</label><br>
    <input type="text" id="kodPocztowy" name="kodPocztowy"><br>
    <input type="submit" value="Znajdź Twoją restaurację">
</form>

Anybody help? Pretty please...

CodePudding user response：

Sprobuj tego. Wszystko wyjasnione w komentarzach w kodzie.

<!DOCTYPE html>
<script>

   function sprawdzKody() {

      /*
         Utworzymy mapowanie dla poszczegolnych regionow.
         Kazdy element ponizszej tablicy to kolejny region strony w formacie:

         {
            kody: [lista kodow pocztowych],
            url:  "adres strony WWW"
         }
      */
      const mapowanie = [
         {
            kody: ["00-807", "00-808", "00-809"],
            url:  "https://mokotow.geishasushi.pl"
         },
         {
            kody: ["01-807", "01-808", "01-809"],
            url:  "https://ursynow.geishasushi.pl"
         },
         {
            kody: ["01-807", "01-808", "01-809"],
            url:  "https://targowek.geishasushi.pl"
         },
         {
            kody: ["03-807", "03-808", "03-809"],
            url:  "https://ursynow.geishasushi.pl"
         }
      ]

      // Pobieramy kod pocztowy z formularza
      var kodPocztowy = document.getElementById("kodPocztowy").value;

      // Domyslna strona przekierowania, gdy nie znajdziemy odpowiedniego rejonu
      let stronaPrzekierowania = "http://geishasushi.pl/jestes-poza-rejonem";

      // Przechodzimy po kazdym rejonie i sprawdzamy
      for (let i = 0; i < mapowanie.length;   i)
      {
         const rejon = mapowanie[i];

         // Jesli kod pocztowy znajduje sie na liscie kodow, ustawiamy strone
         // Przekierowania i wychodzimy z petli.
         if (rejon.kody.includes(kodPocztowy))
         {
            stronaPrzekierowania = rejon.url;
            break;
         }
      }

      // Przekierowanie
      location.href = stronaPrzekierowania;

      // Return false sprawia, ze formularz nie odswiezy obecnej strony,
      // tylko zaladuje wybrany powyzej adres
      return false;

   }
</script>

<form onsubmit="return sprawdzKody();" >
    <label for="kodPocztowy">Kod Pocztowy</label><br>
    <input type="text" id="kodPocztowy" name="kodPocztowy"><br>
    <input type="submit" value="Znajdź Twoją restaurację">
</form>