В каком порядке мне нужно выполнить обработку ошибок и перенаправление в onSubmit формы? - PullRequest
0 голосов
/ 20 мая 2019

Я работаю над созданием страницы отказа.Я новичок в JavaScript, и у меня возникли проблемы с выяснением, как я должен выполнять задачи и в каком порядке.Вот что я хочу сделать:

  1. Пользователь должен выбрать один из переключателей.Ни один не вариант.Если отмечены вторые или третьи переключатели, мне нужно проверить, есть ли что-то в соответствующем текстовом поле.
  2. При отправке формы мне нужно, чтобы она динамически перенаправляла мою форму на другую страницу после того, как она прошла проверку.,
  3. Мне нужна форма для публикации на любую страницу, на которую он перенаправляет.

В настоящее время, если проверка не пройдена, она перезагружает страницу.Если выбран какой-либо переключатель (независимо от текстовых полей), он будет перенаправлен правильно.

Я знаю, что, должно быть, упускаю что-то глупое.Кто-нибудь видит какие-либо явные ошибки?

КОД:

function NewPage(form, name) {

  //get The Elements From The Form
  var getRequestForm = document.getElementById("requestForm");

  //these are the Elements From The Form
  var x = document.forms["requestForm"]["radio1"].value;
  var a = document.forms["requestForm"]["radio2"].value;
  var b = document.forms["requestForm"]["radio3"].value;
  var y = document.forms["requestForm"]["ChangeEmailAddress"].value;
  var z = document.forms["requestForm"]["Unsubscribe"].value;

  //now lets print them
  Console.log(x);
  Console.log(a);
  Console.log(b);
  Console.log(y);
  Console.log(z);

  var submit = true;

  if (x == null && a == null && b == null) {
    nameError = "Please select an option";
    document.getElementById("name_error").innerHTML = nameError;
    submit = false;
  }

  if (y == undefined && a != undefined) {
    emailError = "Please enter your email";
    document.getElementById("email_error").innerHTML = emailError;
    submit = false;
  }

  return submit;

  function removeWarning() {
    document.getElementById(this.id + "_error").innerHTML = "";
    document.getElementById("ChangeEmailAddress").onkeyup = removeWarning;
  }

  for (var i = 0, radio = form.elements; i < radio.length; i++) {
    if (radio[i].name == name && radio[i].checked) {
      form.action = radio[i].value;
    }
  }
}
  input[type=submit] {
  border: 1px solid #603795;
  color: #fff;
  background: #603795;
  padding: 18px 45px;
  Margin-left: 0px;
  border-radius: 3px;
  -webkit-appearance: none;
}

@media screen and (max-width: 600px) {
  .col-25,
  .col-75,
  input[type=submit] {
    width: 35%;
    margin-left: -0px;
  }
<div align="center">
  <div style="align: center; width: 100%; height: 100%;">
    <form action="#" method="post" id="requestForm" name="requestForm" onsubmit=" NewPage(this, 'radio');">
      <span class="error"><p id="name_error"></p></span>
      <span class="error"><p id="email_error"></p></span>

      <label class="container"> Never mind. I don't want to unsubscribe at all.
                    <input type="radio" id="radio1" name="radio" value="%%=RedirectTo(CloudPagesURL(159))=%%">
                    <span class="checkmark"></span>
                </label>

      <br><br>

      <label class="container">Actually, I just want to use another email address instead:
                    <input type="radio" id="radio2" name="radio" value="%%=RedirectTo(CloudPagesURL(160))=%%">
                    <span class="checkmark"></span>
                </label>

      <br>

      <div>
        <input type="text" size="50" id="ChangeEmailAddress" name="ChangeEmailAddress" placeholder="Email Address">
      </div>

      <br><br>

      <label class="container">Sorry, but I'd like to unsubscribe:
                    <input type="radio" id="radio3" name="radio" value="%%=RedirectTo(CloudPagesURL(161))=%%">
                    <span class="checkmark"></span>
                </label>

      <br>

      <div>
        <input type="text" id="Unsubscribe" name="Unsubscribe" size="50" placeholder="Email Address" value="%%emailaddr%%">
      </div>

      <br><br>

      <input type="submit" value="Submit" onsubmit="NewPage(this, 'radio');">

      <br><br><br>
    </form>

  </div>

  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

</div>
...