datalist не показывает данные, если они уже содержат предыдущее значение - PullRequest
0 голосов
/ 21 мая 2019

Я создал пользовательское автозаполнение, где я хочу использовать ввод вручную и предлагать варианты из БД.Поэтому я создал код JavaScript, который получает данные из БД и помещает их в список данных.Все отлично работает для первого поиска, но затем я реализовал разделитель, чтобы я мог добавить несколько значений в поле ввода (я хочу там список электронных писем).Когда мой код снова вызывает ajax для следующего автозаполнения, я вижу в консоли, что данные в списке данных были обновлены, но браузер больше не показывает мне никаких данных.

это код:

   <input list="manual_emails" type="text" name="manual_email_entry" id="manual_email_entry" class="form-control" placeholder="zadaj email" />
 <datalist id="manual_emails">
  </datalist>

$('#manual_email_entry').on('input',function(e){

  $entry_term = $('#manual_email_entry').val();

  $search_term = $entry_term.split(/[; ]+/).pop();


  if ($search_term.length > 2) {
    $.ajax({
            type: "POST",
            url: "/find_email/",
            dataType: 'json',
            data: {request: $search_term}

          }).done(function (data) {
            //console.log(data.data)
            var $opt_val = ''
            for ( var i = 0; i < data.data.length; i++) {
              $opt_val += '<option value="'+data.data[i]+'">'
            }

            $('#manual_emails').html('')
            $('#manual_emails').html($opt_val)
          })
    ; 
  }
});

thisвсе в порядке после первой попытки,

enter image description here

1 Ответ

0 голосов
/ 21 мая 2019

Благодаря этой статье я узнал, что работает только тип ввода электронной почты, и мне нужно добавить множественное значение множественный выбор со списком данных

Также работает только запятая, а не точка с запятой в качестве разделителя

<input list="manual_emails" type="email" name="manual_email_entry" id="manual_email_entry" class="form-control" placeholder="Zadaj email" multiple />
            <datalist id="manual_emails">
             </datalist>

$search_term = $entry_term.split(/[, ]+/).pop();
...