Я создаю форму записи и пытаюсь получить час и минуту с помощью $_POST ['minute'], но продолжаю получать "Неопределенная переменная или индекс".
HTML
<form id="theForm" method="POST" onsubmit="ajaxSubmit(); return false">
<h5>Планирование 15-минутной консультации</h5>
<p id="date">MM/DD/YYYY</p>
<div id="time">
<select id="hours" name="hour"></select>
<span>:</span>
<select id="minutes" name="minute"></select>
<div id="timeLabel">
<label class="ampm" name="am" id="am">AM</label> / <label class="ampm" name="pm" id="pm">PM</label>
</div>
</div>
<input placeholder="Name" name="name" id="name" />
<input placeholder="Email" name="email" id="email" />
<button class="submitBtn" name="submitBtn">SUBMIT</button>
<p id="isSent"></p>
</form>
JS
const hours = document.getElementById("hours");
for (let i = 1; i <= 12; i++) {
hours.innerHTML += "<option value="${i}">${i}</option>";
}
const minutes = document.getElementById("minutes");
for(let i = 0; i <= 45; i+=15) {
if(i < 10) {
minutes.innerHTML += "<option value="0${i}">0${i}</option>";
} else {
minutes.innerHTML += "<option value="${i}">${i}</option>";
}
}
function ajaxSubmit() {
let name = document.getElementById('name'),
email = document.getElementById('email'),
date = document.getElementById('date'),
hours = document.getElementById('hours'),
minutes = document.getElementById('minutes'),
am = document.getElementById('am'),
pm = document.getElementById('pm');
const xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.status == 200 && xhr.readyState == 4) {
document.querySelector("#isSent").innerHTML = xhr.responseText;
}
}
xhr.open('POST', 'mail.php?', true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send("name=" + name.value +
"&email=" + email.value +
"&date=" + date.value +
"&hours=" + hours.value +
"&minutes=" + minutes.value +
"&am" + am.value +
"&pm" + pm.value);
}
Я пробовал $hour = $_POST['hour']; но это не работает, то же самое с минутой. Итак, вот мой PHP:
$hour = null;
$minute = null;
if(isset($_POST['hour'])) {
$hour = $_POST['hour'];
}
if(isset($_POST['minute'])) {
$minute = $_POST['minute'];
}
Ответ 1
Проблема заключается в том, как вы отправляете данные формы в PHP. Лучше всего использовать новую функцию FormData() из Javascript. Она отправляет сериализованные данные, поэтому дополнительная обработка не требуется.
const hours = document.getElementById("hours");
for (let i = 1; i <= 12; i++) {
hours.innerHTML += "<option value="${i}">${i}</option>";
}
const minutes = document.getElementById("minutes");
for (let i = 0; i <= 45; i += 15) {
if (i < 10) {
minutes.innerHTML += "<option value="0${i}">0${i}</option>";
} else {
minutes.innerHTML += "<option value="${i}">${i}</option>";
}
}
function ajaxSubmit() {
var form = document.querySelector('form');
var data = Object.fromEntries(new FormData(form));
console.log(data)
const xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.status == 200 && xhr.readyState == 4) {
document.querySelector("#isSent").innerHTML = xhr.responseText;
}
}
xhr.open('POST', 'mail.php?', true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send(data);
}
<form id="theForm" method="POST" onsubmit="ajaxSubmit(); return false">
<h5>Планирование 15-минутной консультации</h5>
<p id="date">MM/DD/YYYY</p>
<div id="time">
<select id="hours" name="hour"></select> <span>:</span>
<select id="minutes" name="minute"></select>
<div id="timeLabel">
<label class="ampm" name="am" id="am">AM</label> / <label class="ampm" name="pm" id="pm">PM</label>
</div>
</div>
<input placeholder="Name" name="name" id="name" />
<input placeholder="Email" name="email" id="email" />
<button class="submitBtn" name="submitBtn">SUBMIT</button>
<p id="isSent"></p>
</form>
Ответ 2
Измените ваш $_POST с hour на множественное число hours, то же самое с minute на minutes.
$hours = null;
$minute = null;
if(isset($_POST['hours'])) {
$hours = $_POST['hours'];
}
if(isset($_POST['minutes'])) {
$minutes = $_POST['minutes'];
}
if(isset($hours) and isset($minutes))
echo "ваше расписание 15-минутной консультации($hours:$minutes) зарегистрировано!";
Совет: для создания читаемого формата времени с помощью javascript используйте функцию padStart():
for(let i = 0; i <= 45; i+=15) {
minutes.innerHTML +=
"<option value="${(''+i).padStart(2,'0')}">${(''+i).padStart(2,'0')}</option>";
}
Вместо условного оператора if else.
for(let i = 0; i <= 45; i+=15) {
if(i < 10) {
minutes.innerHTML += "<option value="0${i}">0${i}</option>";
} else {
minutes.innerHTML += "<option value="${i}">${i}</option>";
}
}
Web