К примеру есть таблица с полями: Возраст, пол, работа. И несколько радиобаттонов на форме: Петр, Василий, Маша, Лена. При выборе к примеру радиобаттона "Лена", в таблицу добавлялись несколько значений: 27 лет, женский, менеджер. Как сделать добавление нескольких значений в таблицу при выборе только одного радиобаттноа ? И вообще можно ли так ?
1 ответ
Если задача состоит в том, чтобы отправить какие-либо данные, которых не видит пользователь. То можно либо скрыть данные в теге form, либо сделать XHR запрос, в котором сайт будет отправлять необходимые данные
1 Способ состоит в том, чтобы отправить скрытые данные, вместе с формой
<form action="" method="get">
<!-- ЭТИ ПОЛЯ ПОЛЬЗОВАТЕЛЬ НЕ ВИДИТ, НО ОНИ ОТПРАВЛЯЮТСЯ НА PHP ОБРАБОТЧИК -->
<input type="hidden" name="gender" value="[YOUR_VALUE_GENDER]">
<input type="hidden" name="age" value="[YOUR_VALUE_AGE]">
<input type="hidden" name="role" value="[YOUR_VALUE_MANADGER]">
<!-- ЭТИ ПОЛЯ ПОЛЬЗОВАТЕЛЬ МОЖЕТ ИЗМЕНИТЬ, ОДНАКО ЗНАЧЕНИЕ В СКРЫТЫХ ПОЛЯХ НЕ ИЗМЕНИТСЯ -->
<input type="radio" id="contactChoice1" name="contact" value="Пётр">
<label for="contactChoice1">Пётр</label>
<input type="radio" id="contactChoice2" name="contact" value="Василий">
<label for="contactChoice2">Василий</label>
<input type="radio" id="contactChoice3" name="contact" value="Маша">
<label for="contactChoice3">Маша</label>
<input type="radio" id="contactChoice4" name="contact" value="Лена">
<label for="contactChoice4">Лена</label>
<button type="submit">Отправить</button>
</form>
2 Способ - отправлять данные по событию, через XHR Запрос Вы можете отправить нужные данные, прямо при выборе radioButton. В примере ниже предоставлены статические данные, однако, вы можете изменить их любым. удобным для вас методом
HTML код радио кнопок теперь выглядит так
<!-- Отправка данных происходит по нажатию на радиоКнопку -->
<input type="radio" id="contactChoice2" name="contact" value="Василий" onclick="hideSend(this);">
<label for="contactChoice2">Василий</label>
<input type="radio" id="contactChoice3" name="contact" value="Маша" onclick="hideSend(this);">
<label for="contactChoice3">Маша</label>
<input type="radio" id="contactChoice4" name="contact" value="Лена" onclick="hideSend(this);">
<label for="contactChoice4">Лена</label>
JavaSrupt код для отправки данных, при выборе радикнопки:
// Функция, для отправки скрытых данных
function hideSend (valueName) {
var xhr = new XMLHttpRequest();
// Формируем список отправляемых параметров
var params =
'gender=' + encodeURIComponent('[YOUR_VALUE_GENDER]') +
'&age=' + encodeURIComponent('[YOUR_VALUE_GENDER]') +
'&role=' + encodeURIComponent('[YOUR_VALUE_MANADGER]') +
// Значение нажатого инпута
'&name=' + encodeURIComponent(valueName);
xhr.open(
"GET", // Тип отправки GET | POST
'/submit?' + params, // Путь до PHP обработчика
true);
xhr.send();
}
После получения данных от пользователя. добавьте необходимые данные, при помощи PHP Обработчика
-
Подскажите, а как конкретно задать значения для отдельных радиобаттонов ? То есть для Маши добавятся одни, для Петра другие. Вот это не могу понять. Commented 23 апр. 2020 в 18:18
-
Я не совсем понимаю вопрос. Буквально, если пользователь выбирает "Маша", то должны отправляться примерно вот такие данные "27 лет, женский, менеджер", если "Петя" то "35 лет, мужской, разработчик" и так далее? Commented 28 апр. 2020 в 21:17