em xin trình bày ý tưởng của em như sau:
Đầu tiên, em fetch api để lấy được giá trị id trong api. Sau khi lấy thành công thì mỗi input sẽ bao gồm id lấy trong api. Sau khi người dùng chọn đáp án và bấm submit thì sẽ repsonse ra một json body có dạng là một object lưu value và id của câu hỏi (thực ra đoạn này em cũng không biết phải diễn tả như nào) được trình bày theo form sau:
answer {
"id":"value" trong đó id là id của đáp án được chọn và value là value của đáp án đấy
}
Vậy cho em hỏi là làm sao sau khi em fetch được thành công, làm sao em có thể lấy được dữ liệu mà người dùng đã chọn và sau khi submit thì sẽ response ra một object như form em muốn ạ. Em chỉ biết làm phần fetch api ra id, còn lại thì em không biết làm và rất mơ hồ, không biết phải làm như thế nào. Em xin chân thành cảm ơn
<form>
<h2>Câu 1</h2>
<input type="radio" value='1' name="c1">
<label>1</label><br>
<input type="radio" value='2' name="c1">
<label>2</label><br>
<input type="radio" value='3' name="c1">
<label>3</label><br>
<input type="radio" value='4' name="c1">
<label>4</label><br>
<h2>Câu 2</h2>
<input type="radio" value='1' name="c2">
<label>1</label><br>
<input type="radio" value='2' name="c2">
<label>2</label><br>
<input type="radio" value='3' name="c2">
<label>3</label><br>
<input type="radio" value='4' name="c2">
<label>4</label><br>
<div class="button">
<button type="submit">Submit</button>
</div>
</form>
function onResponse(res) {
return res.json();
}
function data(data) {
//chuyển data thành object của js
const a = JSON.stringify(data);
const b = JSON.parse(a);
const form = document.querySelectorAll('input');
//gán id cho mỗi input
for (let i = 0; i < form.length; i++) {
form[i].id = b[i].id;
}
// lấy value và id của các đáp án được chọn
function onSubmit() {
//tạo mảng để thành form "id":"value"
const na = {}
const inputWord = document.querySelectorAll("input");
for (let i = 0; i < inputWord.length; i++) {
//lấy ra value của input
const word = inputWord[i].value;
//lấy ra id của input sau khi fetch từ api
const name = inputWord[i].id;
na[name] = word;
//từ đoạn này về sau em không biết làm
}
fetch('https://jsonplaceholder.typicode.com/users', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
answer: na
})
})
}
const new_form = document.querySelector('form');
new_form.addEventListener('submit', onSubmit);
}
fetch('https://jsonplaceholder.typicode.com/users').then(onResponse).then(data);
Em xin lỗi vì có thể các câu hỏi của em nó thực sự gây khó chịu cho mọi người, em cũng nhận ra là bản thân mình còn yếu kém và cần phải học hỏi nhiều. Vì vậy, em mong mọi người góp ý, chia sẻ ý kiến để bản thân có thể tiến bộ đồng thời trong tương lai em sẽ không còn tiếp tục tình trạng này nữa. Em xin chân thành cảm ơn