배열 안에 라디오 버튼의 값을 저장하는 방법

Question

저는 Ajax에 대해 처음이에요. 그래서 나는 "question"을 위해했던 것처럼 배열의 라디오 버튼의 값을 어떻게 저장할 수 있는지 궁금합니다. "대답"및 "시 험". PHP 스크립트를 통해 정보를 전송해야하므로 데이터를 저장하려고합니다. 어떤 도움을 주시면 감사하겠습니다.

<div id="container"> 
    <form> 

    <div> 
     <input type='text' id='Question' class="form-control" placeholder="Question" /> 
     <input type='text' id='Answer' class="form-control" placeholder="Answer" /> 
     <input type='text' id='Testcases' class="form-control" placeholder="Testcases" /> 

     <p style="margin-left:150px;"> 
     <label>Difficulty level:</label> 
     <input type="radio" name="A" id='E' value="Easy" checked="checked" /> 
     <label for='E'>Easy</label> 
     <input type="radio" name="A" id='M' value="Medium" /> 
     <label for='M'>Medium</label> 
     <input type="radio" name="A" id='H' value="Hard" /> 
     <label for='H'>Hard</label> 
     </p> 
    </div> 
    <input type='button' class='lg-button' onclick='send()' value='Submit' /> 

    </form> 
</div> 

<script> 
    function send() { 
    var question = document.getElementById('Question').value; 
    var answers = document.getElementById('Answer').value; 
    var cases = document.getElementById('Testcases').value; 

    var ch = document.getElementsByName('A').value; 

    var data = { 
     'Question': question, 
     'Answer': answers, 
     'Testcases': cases, 
     'A': ch 
    }; 

    var hr = new XMLHttpRequest(); 
    hr.onreadystatechange = function() { 
     if (hr.readyState === 4) { 
     document.getElementById('send').innerHTML = hr.responseText; 
     } 
    }; 


    hr.open("POST", "URL", true); 

    hr.send(JSON.stringify(data)); 

    //alert(JSON.stringify(data)); 
    } 

</script> 

Answer 1

아래

작업 코드는,

function send() { 
 

 
    const question = document.getElementById('Question').value; 
 
    const answers = document.getElementById('Answer').value; 
 
    const testCases = document.getElementById('Testcases').value; 
 

 
    const level = document.querySelector('[name="A"]:checked').value; 
 

 
    const data = { 
 
    'Question': question || '', 
 
    'Answer': answers || '', 
 
    'Testcases': testCases || '', 
 
    'A': level 
 
    }; 
 

 
    console.log(data); 
 

 
    const xhr = new XMLHttpRequest(); 
 
    xhr.onreadystatechange = function() { 
 
    if (xhr.readyState === 4) { 
 
     document.getElementById('response').innerHTML = xhr.responseText; 
 
    } 
 
    }; 
 

 
    xhr.open("POST", "URL", true); 
 
    xhr.send(JSON.stringify(data)); 
 
}

<div id="container"> 
 

 
    <input type='text' id='Question' class="form-control" placeholder="Question" /> 
 
    <input type='text' id='Answer' class="form-control" placeholder="Answer" /> 
 
    <input type='text' id='Testcases' class="form-control" placeholder="Testcases" /> 
 

 
    <p style="margin-left:150px;"> 
 
     <label>Difficulty level:</label> 
 

 
     <input type="radio" name="A" id='E' value="Easy" checked="checked" /> 
 
     <label for='E'>Easy</label> 
 

 
     <input type="radio" name="A" id='M' value="Medium" /> 
 
     <label for='M'>Medium</label> 
 

 
     <input type="radio" name="A" id='H' value="Hard" /> 
 
     <label for='H'>Hard</label> 
 
    </p> 
 

 
    <input type='button' class='lg-button' onclick='send()' value='Submit' /> 
 

 
    <p id="response"></p> 
 
</div>