Option и data-val


Задача:

Необходимо передать в пост запросе содержимое, находящееся между тегами option в списке.

Решение

Уточним задачу. Есть список:

<select name="data" id="data" >
<option value="0">Дата отправления</option>
<option value="1">28.05.2018, Понедельник</option>
<option value="2">29.05.2018, Вторник</option>
</select>
Самое первое, что приходит на ум – это просто содержимое, находящееся между тегами (наименованиями списка) занести в атрибут value. Тогда все было бы предельно просто, в обработчике определяем переменную:

$perem = $_POST['data'];
И работаем с ней дальше. Однако, по некоторым причинам делать так нельзя. В атрибуте value должны быть ид элемента. Но что нам мешает добавить еще один атрибут? Ничего! Так и поступаем – добавляем атрибут data-val, получается так:

<select name="data" id="data">
<option value="0">Дата отправления</option>
<option value="1" data-val="28.05.2017, воскресенье">28.05.2018, Понедельник</option>
<option value="2" data-val="30.05.2017, вторник">29.05.2018, Вторник<</option>
</select>
Теперь с помощью функции jQuery data('val') мы можем в любой момент получить значение этого атрибута. Что мы и делаем в данной функции:

function dattVs() { 
var zn = $('#data option:selected').data('val'); 
}
Здесь мы выбираем текущий элемент списка и получаем data-val его. Осталось повесить обработчик события, срабатывающий при выборе пункта в списке. Итоговый результат по списку:

vselect name="data" id="data" onchange="dattVs();">
<option value="0">Дата отправления</option>
<option value="1">28.05.2018, Понедельник</option>
<option value="2">329.05.2018, Вторник</option>
</select>
Однако, метод dattVs() просто получает значение, но никуда его не заносит или не отправляет. Решим и этот вопрос. Создадим в нашей форме еще одно поле input типа hidden:

<input type="hidden" value="0" name = "datt" id="datt" />
и в него будем заносить это значение. Теперь функция выглядит так:

function dattVs() { 
var zn = $('#data option:selected').data('val'); 
$("#datt").val(zn);
}
Вот и все, теперь, чтобы работать в php со значением между тегами option, надо просто взять его из пост запроса:

$perem = $_POST['datt'];
Автор этого материала - я - Пахолков Юрий. Я оказываю услуги по написанию программ на языках Java, C++, C# (а также консультирую по ним) и созданию сайтов. Работаю с сайтами на CMS OpenCart, WordPress, ModX и самописными. Кроме этого, работаю напрямую с JavaScript, PHP, CSS, HTML - то есть могу доработать ваш сайт или помочь с веб-программированием. Пишите сюда.

тегизаметки, html, javascript, jquery, php




Отправляя сообщение я подтверждаю, что ознакомлен и согласен с политикой конфиденциальности данного сайта.




Урок 22. hashcode и equals в Java: часть 1
Демон на службе, или историческое фэнтези
Что это такое атрибуты в PHP 8