Как отправить форму и перенаправить пользователей на разные страницы в зависимости от того, что они выбирают в раскрывающемся меню.

Я разрабатываю html-страницу, в которой пользователь отправляет форму, содержащую раскрывающийся список для выбора значения. Как только пользователь отправит форму, я хочу отправить форму и перенаправить пользователей на разные страницы в зависимости от того, что они выбирают в раскрывающемся списке.

HTML-код формы

<form action="#" method="post" class="form-group" id="dtls">
          <label for="sp">Choose one:</label><select name="sp" id="sponsor" class="form-control">
            <option value="mark" id="s1">Mark</option>
            <option value="markus" id="s2">Markus</option>
          </select>
          <label for="mail">Your Email:</label><input type="email" name="mail" class="form-control" placeholder="Email Address...">
          <input type="submit" name="sub" class="btn form-control btn-success" id="but">
        </form>

Может ли кто-нибудь предложить мне хороший способ решить эту проблему? Спасибо


person Ashan    schedule 17.08.2017    source источник
comment
В PHP (поскольку вы отметили это) делайте все, что вам нужно, со значениями формы, а затем выполняйте некоторую логику (базовый if или switch) и перенаправляйте их на соответствующую страницу.   -  person Reinstate Monica Cellio    schedule 17.08.2017


Ответы (2)


Конечно, что-то вроде этого в вашем JS:

redirectPage() {
  // Gets value of dropdown
  var selectedOption = $("#sponsor option:selected").val();

  // Picks correct url to go to
  var url;
  switch(selectedOption) {
    case "mark":
      url = "your link #1 here";
      break;
    case "markus":
      url = "your link #2 here";
      break;
    default:
      url = "";
      break;
  }

  // Changes current page and keeps back history
  window.location.assign(url);
}

Простой способ избавиться от большого оператора switch — просто сделать значение каждой опции URL-адресом, если вы не используете значения раскрывающегося списка для чего-либо еще. Вы можете в любой момент заменить .val() на .text(), чтобы вывести «Марк» и «Маркус» из раскрывающихся списков.

Ссылки:

Получить значение раскрывающегося списка в jQuery

Как перенаправить на другую веб-страницу в JavaScript/jQuery?

person mintychai    schedule 17.08.2017

Php

if(isset($_POST["sub"])) {
    $value = $_POST["sp"];
    header("location: /$value");
}

Вы можете сделать операторы if со значением или напрямую перенаправить пользователя, установив заголовок, как я, или эхо javascript window.location

jQuery

$("#dtls").submit(function() {
    var value = $("#sponsor").val();
    if(value == "mark") {
        window.location.href = "/mark";
    } elseif(value == "markus") {
        window.location.href = "/markus";
    }
});
person Toni Isotalo    schedule 17.08.2017