Bootstrap typeahead выберите событие для формы - PullRequest
0 голосов
/ 08 июня 2018

Добрый день.Я начинаю использовать bootstrap3-typeahead.min.js версии 4.0.2, и это хорошо, это работает очень хорошо.Моя версия Twitter-Bootstrap - 3.3.7.

Итак, насколько я понимаю, я должен использовать специальный сценарий typeahead, поскольку в этой версии его нет.

При поиске здесь и на других страницах я нашел скрипт, в котором, когда я выбираю нужный вариант, он автоматически запускает форму, хотя он не работает, он только помещает значение поиска ввход.Попробовал положить console.log, но он тоже не запускается.Вот онлайн-сценарий типа twitter-bootstrap3:

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.2/bootstrap3-typeahead.min.js"></script>  

Вот мой код:

$(document).ready(function(){
$('#valor').typeahead({
source: function(query, result)
{
 $.ajax({
  url:"mySearchUrl.php",
  method:"POST",
  data:{query:query},
  dataType:"json",
  success:function(data)
   {
     result($.map(data, function(item){
     return item;       
   }));   
  }
 })
}
 }).on('typeahead:selected', function(e){
  console.log("hello");
  e.target.form.submit();
 });
});

Вот моя форма:

<form class="navbar-form navbar-left" id="form_buscar" name="form_buscar" method="post" action="myurl.php">
      <div class="input-group">
       <input type="text" name="valor" id="valor" class="form-control" autocomplete="off" placeholder="Buscar nombre, credito o calle" />
        <div class="input-group-btn">
          <button class="btn btn-default" name="buscar" id="buscar" type="submit">
            <i class="glyphicon glyphicon-search"></i>
          </button>
        </div>
      </div>
    </form>

Всеработает очень хорошо, кроме той части, где выбрано событие.

Кроме того, я читал об этом другом сценарии, но я не могу заставить его работать:

 $('#valor').on('typeahead:select', function(evt, item) {
    console.log(evt)
    console.log(item)

})

Спасибозаблаговременно.

...