Как я могу добавить уведомление о подтверждении выбора переключателя?

В конце формы у меня есть приведенный ниже код, который просит пользователя выбрать переключатели «да» или «нет». Часто выбирается неправильный вариант, и я хочу ограничить это, добавив подтверждение/предупреждение «Вы уверены». Варианты должны остаться прежними, просто да/нет, я думаю.

<td class="t1_head">Keep with Tier 3?</td>
<td class="t1">
  <input type="radio" name="open" value="Yes" checked> Yes &nbsp; 
  <input type="radio" name="open" value="No"> No &nbsp; 
  <i>(This overrides the above scheduling)</i>
</td>

Любая помощь, очень ценится.


person djd    schedule 31.07.2015    source источник
comment
Вы хотите сделать это с помощью javascript, когда пользователь нажимает? Если это так, вы можете использовать простой ванильный js или, если он у вас загружен, используйте jQuery. Довольны ли вы стандартным оповещением или вам нужна индивидуальная коробка и т. д.?   -  person Simon Pollard    schedule 31.07.2015
comment
Привет, Саймон, вот что у нас есть на данный момент: ‹td class=t1_head›Сохранить с уровнем 3?‹/td› ‹td class=t1›‹input type=radio name=open value=Да выбрано› Yes ‹input type= Radio name=open value=No› Нет ‹i›(это отменяет указанное выше расписание)‹/i›‹/td›   -  person djd    schedule 31.07.2015
comment
Просто ищите стандартное оповещение, чтобы сказать «Вы уверены» с выбранным «да» или «нет». а затем либо продолжить, либо разрешить им изменить переключатель   -  person djd    schedule 31.07.2015


Ответы (1)


Вы можете сделать это с помощью javascript

<script>
  // get yes button
  var yes = document.getElementById('YesID');

  // get no button
  var no = document.getElementById('NoID);

  // when yes is clicked
  yes.addEventListener('click', function(e) {
    // warn
    var result = warn();

    // if selected no, switch button
    if (!result) no.checked = true;
  });

  // when no is clicked
  no.addEventListener('click', function(e) {
    // warn
    var result = warn();

    // if selected no, switch button
    if (!result) yes.checked = true;
  });

  function warn() {
    return confirm('Are you sure you want to select this ?');
  }
</script>

Примечание. Замените «YesID» и «NoID» правильным идентификатором двух переключателей.

person Community    schedule 31.07.2015
comment
Большое спасибо, я попробую это в понедельник и дам вам знать. - person djd; 31.07.2015