Отправка скрытого значения списка данных html5 в базу данных
Я относительно новичок в html5 и пытаюсь собрать веб-страницу, используя объект списка данных. Я заполняю свои базы данных из базы данных, пример показан ниже:
Я хочу, чтобы пользователи увидели список дат в раскрывающемся списке и щелкнули по кнопке, чтобы опубликовать связанный номер значения данных в базе данных (это первичный ключ). Вопрос в том, как мне получить значение данных для использования в php для отправки в базу данных (я могу получить значение в javascript, но я не хочу использовать javascript для подключения к базе данных, так как я сказал, что это не очень хорошая практика). Большое спасибо заранее. Martyn
<input type="text" list="eventList" autocomplete="off" id="searchEvents" name="searchEvents">
<datalist id="eventList">
<option data-value="1" value="2016-06-02">2016-06-02</option>
<option data-value="2" value="2016-06-09">2016-06-09</option>
</datalist>
Решение
Вы не должны получить свой Основной ключ из предоставленных пользователем данных. Лучше рассчитать или автоматически сгенерировать это на стороне сервера на основе предоставленных пользователем данных.
В любом случае, вы можете добавить скрытые поля в форму, используя что-то вроде этого:
<input type="hidden" name="hiddenvar" value="some secret" />
Вы бы положили это в HTML-форма. Вы можете иметь JavaScript вставить этот элемент в форме, когда пользователь выбирает вариант из выпадающего списка.
Отправленные данные формы отправляются в сценарий / URL, указанный в action атрибут формы. На стороне сервера PHP получает данные в переменную $_POST.
Редактировать на основе комментария ОП:
Ты сможешь еще нужно добавить скрытый элемент, как указано выше, но вы можете сделать это с помощью элемента, подобного этому:
<input type="hidden" name="searchEventsID" value="" />
Сначала оставьте это поле пустым, а затем установите для JS значение, соответствующее data-value приписывать.
Обратите внимание, что оба примера предназначены для hidden элемент, поэтому пользователь не увидит его. Но он будет отправлен на сервер, когда пользователь отправит его.
Изменить 2:
Установить onchange атрибут выбора <input> тег к функции JS, которая сделает все необходимое. Смотрите ссылки выше о том, как это сделать. И, возможно, Google для некоторых учебных пособий. Это так ответ имеет аналогичную «структуру», но вам нужно выяснить, что вам нужно сделать. В частности,
var hidden_val = document.getElementById('eventList').getAttribute('data-value');
document.getElementById('searchEventsID').value = hidden_val;
// done in two lines for clarity but you can do it in one.