И так я долго решался, создавать ли эту тему или нет, но всё же решился. Потому что я нахожусь в тупике и уже не знаю куда обращаться. В общем, есть тест (если его можно так назвать) с рабочим javascript кодом, в котором показываются результат тестирования. Но у меня не получается синхронизировать (наверно я правильно подобрал это слово) данные этого скрипта в базе данных. Я только знаю, что это можно реализовать с помощью аякса, но у меня не получается так сделать. База данных у меня имеется, нужно в ней синхронизировать данные. Надеюсь кто-по понял, что я написал. Если есть какие-то вопросы, то задавайте. А и ещё... у меня есть наброски кода аякс и php (может это как-то поможет).
Это у нас сам опросник (опросник куда больше, но я выставил его часть. Если нужно его продолжение, то я скину).
<form method="POST" action="otpravka.php" id="form">
<section class="table_1">
<table class="iksweb" name="checkbox">
<tbody>
<tr>
<td rowspan="3"><b>История компании «Mc donald's»</b>
<h3 class="the">Кто основал компанию «Mc donald's»?</h3>
<section class="conteiner">
<div class="checkbox">
<input type="checkbox" class="i-6" id="i6" value="0" name="formDoor[]">
<label for="i6" tabindex="12">Роналд Макдоналд</label>
</div>
<div class="checkbox">
<input type="checkbox" class="i-6" id="i7" value="0" name="formDoor[]">
<label for="i7" tabindex="13">Рэй Крок</label>
</div>
<div class="checkbox">
<input type="checkbox" class="i-6" id="checkbox_68" value="1" name="formDoor[]">
<label for="checkbox_68" tabindex="14">Братья Дик и Мак Макдоналд</label>
</div>
<div class="checkbox">
<input type="checkbox" class="i-6" id="checkbox_170" value="0" name="formDoor[]">
<label for="checkbox_170" tabindex="14">Клинт Иствуд</label>
</div>
<div class="out-block out-6"></div>
</section>
</td>
</tr>
</tbody>
</table>
</section>
<div class="dsw">
<button class="b-6" tabindex="11" id="btn-1" type="submit" name="formSubmit">Результат</button>
<div>
Тут у нас код js и аякс (который скорее всего не правильный).
/* Главный скрипт формы (опросника) */
const form = document.querySelector('#form')
form.addEventListener('submit', onSubmit)
function onSubmit (event) {
event.preventDefault()
let listCheckbox = document.querySelectorAll('.i-6')
listCheckbox = [...listCheckbox]
// Проверяем выбран ли хотябы один ответ
if (!listCheckbox.some(checkbox => checkbox.checked)) {
alert('Вы не выбрали ни одного ответа')
}
else{
form.addEventListener('submit', onSubmit)
alert('Вы подтверждаете действие?');
}
// Узнаем сколько всего правильных ответов
const rightAnswersCount = listCheckbox.filter(checkbox => Number(checkbox.value) === 1).length
// Узнаем сколько всего не правильных ответов
const wrongAnswerCount = listCheckbox.length - rightAnswersCount
// Узнаем количество правильных ответов
const rightAnswers = listCheckbox.filter(checkbox => Number(checkbox.value) === 1 && checkbox.checked).length
// Узнаем количество не правильных ответов
const wrongAnswer = listCheckbox.filter(checkbox => Number(checkbox.value) === 0 && checkbox.checked).length
// Уведомляем пользователя
alert(`Вы выбрали ${rightAnswers} вариантов из ${rightAnswersCount} правильных`);
/*alert(`Вы ответили не правильно на ${wrongAnswer} из ${wrongAnswerCount}`)*/
//Вывод ответа с процентами
alert(`Процент правильных ответов: ${(rightAnswers / rightAnswersCount) * 100}`);
/*alert(`Процент неправильных ответов: ${(wrongAnswer / wrongAnswerCount) * 100}`)*/
}
/* Скрипт правильных и неправильных ответов */
let button = document.getElementById('btn-1');
button.addEventListener('click', function(e) {
document.querySelectorAll('.i-6').forEach(item => {
let chekcbox = item.closest('div');
if (item.checked && Number(item.value)) {
chekcbox.classList.add("right");
chekcbox.classList.remove("false");
} else if (item.checked) {
chekcbox.classList.add("false");
chekcbox.classList.remove("right");
} else {
chekcbox.classList.remove("right");
chekcbox.classList.remove("false");
}
})
});
$.ajax({
url: 'otpravka.php',
type: 'POST',
data: chekcbox,
beforeSend: ()=>{},
success: (data)=>{
console.log(data);
},
error: (xhr)=>{
console.log(xhr);
},
complete: ()=>{
}
});
});
Здесь присутствует код php, куда данные отправляются (я знаю, что в подключении к базе данных нужно вводить свои данные. Я просто не хочу их показывать. А так данные соответствуют к подключению).
<?php
// подключение к бд
$link = mysqli_connect('localhost', 'db_user', 'password', 'db_name');
$name = $_POST['name'];
$count = $_POST['count'];
$query = "INSERT INTO table (`name`,`count`) VALUES ('{$name}','{$count}')";
$result = mysqli_query($link, $query);
// вывести результат
print_r($result);
?>
Ну как-то так.
Простой
