Как сохранить ответы из викторины типа переключателя в базу данных Firebase, даже если некоторые не отмечены

Здесь есть две вещи, и самый высокий проголосовавший ответ технически корректен в соответствии с вопросом OP.

Кратко суммируется как:

$("some sort of selector").prop("disabled", true | false);

Однако следует ли использовать jQuery UI (я знаю, что OP не был, но некоторые люди, прибывающие сюда, могли бы быть), тогда как это отключит кнопки события click, это не приведет к отключению кнопки в соответствии с стилем UI.

Если вы используете кнопка стиля jQuery UI, тогда ее следует включить / отключить с помощью:

$("some sort of selector").button("enable" | "disable");

http://api.jqueryui.com/button/#method-disable

0
задан Pusher 3 March 2019 в 13:27
поделиться

2 ответа

Вот основной фрагмент. Что помогает вам очистить свой путь. Просто скопируйте код ниже.

<div id="question1"  style="position:fixed; left:20px; top: 50px;">           
    <label>  <input type="radio" name="q0" value="a1" id="a1" class="radio" onchange="checkAns()"> IMAGE 1 <br><br><br> </label>
    <label>  <input type="radio" name="q0" value="a2" id="a2" class="radio" onchange="checkAns()"> IMAGE 2 <br><br><br> </label>
    <label>  <input type="radio" name="q0" value="a3" id="a3" class="radio" onchange="checkAns()"> IMAGE 3 <br><br><br> </label>
    <label>  <input type="radio" name="q0" value="a4" id="a4" class="radio" onchange="checkAns()"> IMAGE 4 <br><br><br> </label>
    <label>  <input type="radio" name="q0" value="a5" id="a5" class="radio" onchange="checkAns()"> IMAGE 5 <br><br><br> </label>
    <button id="btn" disabled>Button</button> 
</div>

<script>
    var a1 = document.getElementById('a1');
    var a2 = document.getElementById('a2');
    var a3 = document.getElementById('a3');
    var a4 = document.getElementById('a4');
    var a5 = document.getElementById('a5');

    function checkAns(){
        console.log(a1.checked, a2, a3, a4, a5);
        if (a1.checked || a2.checked || a3.checked || a4.checked || a5.checked) {
            document.getElementById("btn").disabled = false; 
        }
    }
</script>

Это может помочь.

0
ответ дан Mayur 3 March 2019 в 13:27
поделиться

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

function getUncheckedValues() {
  const obj = {};
  Array.from(document.querySelectorAll('input[type="radio"]'))
  .forEach((checkbox) => {
      obj[checkbox.value] = checkbox.checked
  });
  console.log(obj);
  return obj;
}

const resultEl = document.getElementById('checkedresult');
const resultUncheckEl = document.getElementById('uncheckedresult');

document.getElementById('showResult').addEventListener('click', () => {
  const values = getUncheckedValues();
  console.log(values);
  const newRef = firebase.database().ref('messages').push();
  newRef.set(values);
});
<label>  <input type="radio" name="q0" value="a1" id="a1" class="radio"> IMAGE 1 <br><br><br> </label>
          <label>  <input type="radio" name="q0" value="a2" id="a2" class="radio"> IMAGE 2 <br><br><br> </label>
          <label>  <input type="radio" name="q0" value="a3" id="a3" class="radio"> IMAGE 3 <br><br><br> </label>
          <label>  <input type="radio" name="q0" value="a4" id="a4" class="radio"> IMAGE 4 <br><br><br> </label>
          <label>  <input type="radio" name="q0" value="a5" id="a5" class="radio"> IMAGE 5 <br><br><br> </label>


<br><br>
<button id="showResult">Show checked values</button>
<br><br>
<div id="checkedresult"></div>
<div id="uncheckedresult"></div>

0
ответ дан Subhendu Kundu 3 March 2019 в 13:27
поделиться
Другие вопросы по тегам:

Похожие вопросы: