<input> и <datalist>выпуск: только один <option>в списке, начальное значение <input> - PullRequest
Новая
       6

<input> и <datalist>выпуск: только один <option>в списке, начальное значение <input>

0 голосов
/ 03 января 2019

Некоторые данные не отображаются должным образом. В списке данных предлагается только начальное значение ввода. Где моя ошибка?

Я генерирую с помощью php и данных из Amazon, Google и French BnF (Национальная библиотека) некоторые даталисты, чтобы пользователь мог выбрать свою правильную информацию. Это работает большую часть времени (95%). Но у меня есть проблемы с некоторыми даталистами. Просматривается только одна опция, начальное значение ввода.

Код 1: 

  <input    id="author" name="item_author" value="Sophie de  Ségur"  onchange="javascript:submit();"    list="data_author">
  <datalist id="data_author">
    <option value="Comtesse de Ségur">Amazon</option>
    <option value="Comtesse de Ségur">BnF</option>
    <option value="Sophie Rostopchine de Ségur">Google</option>
    <option value="Sophie de  Ségur">BnF</option>
    <option value=" Bertall">BnF</option>
  </datalist>

Код результата 1: Просматривается только четвертый вариант (начальное значение ввода).

Пример 2: 

  <input    id="author" name="item_author" value="Catherine  Ard"  onchange="javascript:submit();"  list="data_author">
  <datalist id="data_author">
    <option value="Mickael Wiles">Amazon</option>
    <option value="[textes par Catherine Ard]">BnF</option>
    <option value="Catherine  Ard">BnF</option>
  </datalist>

Код результата 2: Только последний просмотренный вариант (начальное значение ввода)

Пример 3: 

  <input    id="publisher" name="item_publisher" value="Gallimard jeunesse"  onchange="javascript:submit();"    list="data_publisher">
  <datalist id="data_publisher">
    <option value="Editions Gallimard">Amazon</option>
    <option value="Gallimard jeunesse">BnF</option>
  </datalist>

код результата 3: Только последний просмотренный вариант (начальное значение ввода)

Во всех 3 примерах, когда я нажимаю на стрелку справа от ввода (в chrome), я ожидаю получить меню со всеми опциями. Но я получаю только тот параметр, который является значением ввода.

1 Ответ

0 голосов
/ 03 января 2019

Проблема связана с автозаполнением «input» с его начальным значением, автозаполнением, которое нельзя выключить «off».

Таким образом, решение в контексте "onchange =" javascript: submit (); "" заключается в использовании 2 "input".

Первый «ввод» с datalist, value = "" и onmousedown = "value = '';" в короткой ширине «вход».

Второй «вход» с начальным значением.

NB1. В зависимости от контекста «формы» вы можете использовать два разных «имени» для двух «входных данных» (и обрабатывать их в PHP или JS).

NB2: причина ограничения ширины (более приятный и меньший MMI), я предпочитаю «вход» с списком данных, а не «выбор».

Решение для примера 1: 

  <input    id="author" name="item_author" onchange="javascript:submit();"  list="data_author" onmousedown="value = '';" style="width:5vmin;">
  <datalist id="data_author">
    <option value="Comtesse de Ségur">Amazon</option>
    <option value="Comtesse de Ségur">BnF</option>
    <option value="Sophie Rostopchine de Ségur">Google</option>
    <option value="Sophie de  Ségur">BnF</option>
    <option value=" Bertall">BnF</option>
  </datalist>
  <input    id="author" name="item_author" value="Sophie de  Ségur"  onchange="javascript:submit();">

Благодаря:

...