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

Question

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

HTML:

<button type="button" class="btn btn-info btn-md" id="mark" onclick="loadNextQues(1)">Mark for Review & Next</button>
<button type="button" class="btn btn-info btn-md">Clear Response</button>
<button type="submit" class="btn btn-info btn-md" id="save" style="position:absolute;right:20px;bottom:35px" onclick="loadNextQues(0)">Save and Next</button>
<form action="check.php">
  <button type='submit' class="btn btn-info btn-md" id="water" style="visibility:hidden;position:absolute;right:20px;bottom:35px">submit</button>

Javascript:

 function loadNextQues(flag) {
  quesno++;
  if (flag == 1) {
    //add css to the button for review
  } else {
    //add css for the button as answered
  }
  url = "http://localhost/assignments/load-questions.php?qno=" + quesno;
  $.get(url, function(data, status) {
    response = JSON.parse(data);
    console.log(response);
    var quest = "<p>" + response.qno + " " + response.question + "</p>";
    quest += "<form>";
    quest +=
      '<input type="radio" name="op" value=\'' +
      response.opA +
      "'>A." +
      response.opA +
      "<br>";
    quest +=
      '<input type="radio" name="op" value=\'' +
      response.opB +
      "'>B." +
      response.opB +
      "<br>";
    quest +=
      '<input type="radio" name="op" value=\'' +
      response.opC +
      "'>C." +
      response.opC +
      "<br>";
    quest +=
      '<input type="radio" name="op" value=\'' +
      response.opD +
      "'>D." +
      response.opD +
      "<br>";
    quest += "</form>";
    document.getElementById("questBox").innerHTML = quest;
  });

  if (quesno == 15) {
    document.getElementById("mark").style.visibility = "hidden";
    document.getElementById("save").style.visibility = "hidden";
    document.getElementById("water").style.visibility = "visible";
  }
  var myArr = [];
  var Selected = document.querySelectorAll('[name="op"]:checked');
  if (Selected != null) {
    arr.push(Selected.value);
  }
  console.log(arr);
}

Answer 1

Вам нужно перебирать элементы, чтобы получить их значения, также arr не определен.

Редактировать, чтобы получить ожидаемый эффект ...

var arr = new Array();
function loadNextQues(flag) {
  var Selected = document.querySelectorAll('[name="op"]:checked');
  if (Selected != null) {
     Selected.forEach(function(radio) {
        arr.push(radio.value);
     });
  }
  console.log(arr);

  quesno++;
  if (flag == 1) {
    //add css to the button for review
  } else {
    //add css for the button as answered
  }
  url = "http://localhost/assignments/load-questions.php?qno=" + quesno;
  $.get(url, function(data, status) {
    response = JSON.parse(data);
    console.log(response);
    var quest = "<p>" + response.qno + " " + response.question + "</p>";
    quest += "<form>";
    quest +=
      '<input type="radio" name="op" value=\'' +
      response.opA +
      "'>A." +
      response.opA +
      "<br>";
    quest +=
      '<input type="radio" name="op" value=\'' +
      response.opB +
      "'>B." +
      response.opB +
      "<br>";
    quest +=
      '<input type="radio" name="op" value=\'' +
      response.opC +
      "'>C." +
      response.opC +
      "<br>";
    quest +=
      '<input type="radio" name="op" value=\'' +
      response.opD +
      "'>D." +
      response.opD +
      "<br>";
    quest += "</form>";
    document.getElementById("questBox").innerHTML = quest;
  });

  if (quesno == 15) {
    document.getElementById("mark").style.visibility = "hidden";
    document.getElementById("save").style.visibility = "hidden";
    document.getElementById("water").style.visibility = "visible";
  }
  var myArr = [];

Answer 2

Вы можете использовать синтаксис ES6 и метод массива .map (). Что-то вроде ...

var arr = Selected.map (dom => dom.value);