JavaScript Радио кнопки не работают и нуждаются в помощи - PullRequest
Новая
       10

JavaScript Радио кнопки не работают и нуждаются в помощи

0 голосов
/ 30 марта 2020 

function validateStudent() {
  //retrieve Last Name, First Name, Email values
  var lastName = document.getElementById("lastName").value;
  var firstName = document.getElementById("firstName").value;
  var email = document.getElementById("email").value;
  var resident = document.getElementById("resident").value;

  //retrieve index value of Advisor
  advisorIndex = document.getElementById("advisor").selectedIndex;
  //Validate and determine class value
  classChecked = false;
  for (var i = 0; i < document.frmStudent.class.length; i++) {
    if (document.frmStudent.class[i].checked == true) {
      classChecked = true;
      vClass = document.frmStudent.class[i].value;
    }
  }


  //Determine resident status
  if (document.getElementById("resident").checked == true) {
    alert("KY Resident:Yes.")
    resident = "Yes";
  } else {
    alert("KY Resident:No.")
    resident = "No";
  }

  //Validate student data entries
  if (lastName == "") {
    alert("Please enter your last name.");
    document.frmOrder.lastName.select();
    return false;
  } else if (firstName == "") {
    alert("Please enter your first name.");
    document.frmOrder.firstName.select();
    return false;
  } else if (email == "") {
    alert("Please enter a valid email address");
    document.frmOrder.email.select();
    return false;
  } else if (classChecked == false) {

    return false;
  } else if (advisorIndex == -1) {


    return false;
  } else {
    //determine Advisor name based on advisor index value
    vAdvisor = document.frmStudent.advisor.options[advisorIndex].value;
    //Prepare and display student entries
    studentEntries =
      alert(studentEntries);
    return false;
  }
}
fieldset {
  width: 50%;
  margin: 0px 0px 10px 1%;
}

legend {
  padding: 2px;
  text-indent: 5px;
}

p {
  margin-left: 1%;
}

#contactEntry label {
  clear: left;
  display: block;
  float: left;
  width: 30%;
  margin: 7px 5px;
}

#contactEntry input {
  display: block;
  float: left;
  width: 60%;
  margin: 7px 5px;
}

input[type="submit"],
input[type="reset"] {
  display: inline;
  float: none;
}
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <title>EKU Student Information</title>
</head>

<body>
  <form name="frmStudent" id="frmStudent" action=" " method="post" onsubmit="return validateStudent();">
    <fieldset id="contactEntry">
      <legend>Contact Information</legend>
      <label for="lastName">Last Name:</label>
      <input type="text" name="lastName" id="lastName" />
      <label for="firstName">First Name:</label>
      <input type="text" name="firstName" id="firstName" />
      <label for="email">E-Mail:</label>
      <input type="text" name="email" id="email" />
    </fieldset>
    <fieldset id="fieldClass">
      <legend>Class Classification</legend>
      <input type="radio" name="class" id="freshman" value="Freshman" checked="checked" /> &nbsp;&nbsp;Freshman
      <br/>
      <input type="radio" name="class" id="sophomore" value="Sophomore" checked="checked" /> &nbsp;&nbsp;Sophomore
      <br/>
      <input type="radio" name="class" id="junior" value="Junior" checked="checked" /> &nbsp;&nbsp;Junior
      <br/>
      <input type="radio" name="class" id="senior" value="Senior" checked="checked" /> &nbsp;&nbsp;Senior
    </fieldset>

    <fieldset id="fieldAdvisor">
      <legend>My Advisor</legend>
      <select size="5" name="advisor" id="advisor">
        <option>Mike Hawksley</option>
        <option value="Chang-Yang Lin">CY Lin</option>
        <option>Steve Loy</option>
        <option>Bob Mahaney</option>
        <option>Ted Randles</option>
      </select>
    </fieldset>
    <p> <input type="checkbox" name="resident" id="resident" />&nbsp;&nbsp;
      <label for="resident">Kentucky Resident</label>
    </p>
    <p><input type="submit" value="Submit" onclick="onsubmit" />&nbsp;&nbsp;&nbsp;&nbsp;
      <input type="reset" value="Reset" /></p>
  </form>
</body>

</html>

Мне поручено выполнить следующее, и у меня проблемы с получением кода для работы. Мы очень ценим любую помощь.

  1. Создание функции проверки формы, которая подтверждает, что пользователь:

    1. Ввод значений в Фамилию, Имя и Электронную почту .
    2. Указывает значение класса путем выбора одной из переключателей класса.
    3. Выбор советника из списка выбора формы.

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

  3. Вызовите функцию проверки формы, используя форму для отправки четного обработчика.
  4. После формы проверяет все входные данные формы, отображает предупреждение для суммирования введенных пользователем данных. Если флажок резидента Кентукки установлен, отобразите сообщение «Резидент KY: Да». Если флажок резидента Кентукки снят, отобразите сообщение «Резидент KY: Нет»

1 Ответ

0 голосов
/ 30 марта 2020

Просматривая ваш код, я вижу, что резидентное условие не закрывается. Пример: 

    {
        alert("KY Resident:Yes.")
        resident = "Yes";
    }
    else
    {
        alert("KY Resident:No.")
        resident = "No";
    {
change it to 

if (document.getElementById("resident").checked == true)
    {
        alert("KY Resident:Yes.")
        resident = "Yes";
    }
    else
    {
        alert("KY Resident:No.")
        resident = "No";
    }

Чтобы сделать ваш код l oop через средство проверки формы, я предлагаю заменить <p><input type="submit" value="Submit" onclick = "onsubmit"/> на <p><input type="submit" value="Submit" onclick = "validateStudent"/>

Для массива вы можете создать это в начале вашей функции validateStudent и в состоянии вы можете вывести sh сообщение. 

function validateStudent() {
  var output = [];

  // change these kind of if statement
  if (document.getElementById("resident").checked == true) {
    alert("KY Resident:Yes.")
    resident = "Yes";
  }
  // to something like this
  if (document.getElementById("resident").checked == true) {
    output.push("KY Resident:Yes.");
    resident = "Yes";
  }

  // at the end of the function
  alert(output.join('\n'))
}
...