Проверка переключателей с Javascript

Question

Я создаю форму запроса оплаты, в которой пользователь будет выбирать, как они хотят получать оплату за сверхурочную работу. Двумя вариантами являются «оплата» (пользователь получает дополнительную плату в своей зарплате) или «время» (пользователь получает компенсационный тайм-аут, который будет принят позднее).

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

Я пытаюсь использовать более простой булевский язык и хотел бы придерживаться этой опции, а не для цикла или использовать JQuery, если это возможно.

здесь соответствующая часть HTML:

<form class="oTcard" name="otCard" onSubmit="return submitCard()" method="post"> 
<div> 
    <label> 
     <span>request</span> 
      <div style="display:block"> 
       <input class="radio" type="radio" id="timePay" name="timePay" value="0" ><span>time</span> 
       <input class="radio" type="radio" id="timePay" name="timePay" value="1"><span>pay</span> 
      </div> 
    </label> 
</div> 
<input type="submit" id="submit" value="submit"> 
</form> 

здесь соответствующая часть JavaScript:

function submitCard (form) { 
    errorString = ""; 
    if((form.timePay[0].checked == false) && (form.timePay[1].checked == false)) { 
     alert("please choose either time or pay"); 
     timePay[0].focus(); 
     return false; 
    } 
    if(errorString = "") { 
     form.submit() 
    } 
} 

Edit добавить следующее:

ответ Кирилл д.Д. указал мне в правильном направлении. Я изменил идентификаторы переключателей, чтобы быть уникальными для каждой кнопки. HTML, теперь гласит:

<form class="oTcard" name="otCard" onSubmit="return submitCard()" method="post"> 
<div> 
    <label> 
     <span>request</span> 
      <div> 
       <input class="radio" type="radio" id="selectTime" name="timePay" value="0"><span>time</span> 
       <input class="radio" type="radio" id="selectPay" name="timePay" value="1"><span>pay</span> 
      </div> 
    </label> 
</div> 
<input type="submit" id="submit" value="submit"> 
</form> 

Я тогда определяется каждую кнопку в виде отдельной переменной, а не все вместе как «timePay», как я был раньше, и изменил JavaScript следующим образом:

if((selectTime.checked == false) && (selectPay.checked == false)) { 
    alert("please choose either time or pay"); 
    selectTime.focus(); 
    return false; 
} 

Answer 1

Сначала в вашем HTML: Вы должны использовать один и тот же «имя» атрибут, а другой ID (demo)

Некоторые браузер не могут быть совместимы с тем, что вы пытаетесь сделать.Вместо того, чтобы использовать параметр «формы» в function submitCard (form), вы просто должны иметь функцию function submitCard(), а затем найти элементы, которые вы хотите в веб-страницы, используя их ID

function submitCard() { 
    checkbox1 = document.getElementById("timeCheckBox").checked 
    checkbox2 = document.getElementById("payCheckBox").checked 
    if(!checkbox1 && !checkbox2) 
     alert("nothing checked !"); 
     return false; 
    } 
    else{ 
     return true 
    } 
} 

HTML, будет выглядеть

<form class="oTcard" name="otCard" onSubmit="return submitCard()" method="post"> 
<div> 
    <label> 
     <span>request</span> 
      <div style="display:block"> 
       <input class="radio" type="radio" id="timeCheckBox" name="timePay" value="0" ><span>time</span> 
       <input class="radio" type="radio" id="payCheckBox" name="timePay" value="1"><span>pay</span> 
      </div> 
    </label> 
</div> 
<input type="submit" id="submit" value="submit"> 
</form> 

Answer 2

Вы не передавая ссылку формы на функцию submitCard().

Изменить

<form class="oTcard" name="otCard" onSubmit="return submitCard()" method="post">

к

<form class="oTcard" name="otCard" onSubmit="return submitCard(this)" method="post">

Парочка другие примечания:

1. Вы не должны использовать идентификатор timePay больше, чем когда-то на форме.
2. Нельзя помещать div теги внутри span теги.

Рабочий пример here

Answer 3

<form class="oTcard" name="otCard" onSubmit="return submitCard(this)" method="post"> 

должны передать аргумент в function.Thats, почему проверка JS получение не удалось.