Как применить метод .on () к автозаполнению? - PullRequest
Новая
       23

Как применить метод .on () к автозаполнению?

0 голосов
/ 22 июня 2019

Обычно я использую библиотеку автозаполнения следующим образом: 

$('#my_id_element').autocomplete({
        source: function(request, response) {
            $.ajax({ ...

Поскольку my_id_element будет создаваться динамически, мне нужно связать автозаполнение с помощью .on() метод.Я попробовал это так: 

$('#my_id_element').on('autocomplete', function () {
        source: function(request, response) {
            $.ajax({...

Однако этот фрагмент приводит к следующему сообщению об ошибке: 

Uncaught SyntaxError: Unexpected token (

и указывает на эту строку: 

source: function(request, response) {

Я проверил все скобки, но они, кажется, совпадают, поэтому, скорее всего, я неправильно применяю метод .on() к autocomplete.

Как правильно связать автозаполнение?

РЕДАКТИРОВАТЬ: размещение полного кода здесь - этот работает, но я застрял при применении к нему метода .on(): 

<script>
    $('#my_id_element').autocomplete({
        source: function(request, response) {
            $.ajax({
                url: '<%= autocomplete_company_name_path %>',
                dataType: "json",
                data: {
                    term : request.term
                },
                success: function(data) {
                    response(data);
                }
            });
        },
        min_length: 3,
        delay: 400,
        select: function(e, ui) {
                console.log(ui.item);
                $("#address").val(ui.item.address);
                $("#city").val(ui.item.city);
                $("#state").val(ui.item.state);
                $("#zip").val(ui.item.zip_code);
                $("#country").val(ui.item.country);
        }
    });
</script>

1 Ответ

0 голосов
/ 22 июня 2019

Взгляните на документацию и раздел событий https://api.jqueryui.com/autocomplete/#event-open

var tags = ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby"];
$("#autocomplete").on('autocompleteopen', function (event, ui) {
  console.log('test')
}).autocomplete({
  source: function (request, response) {
    var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex(request.term), "i");
    response($.grep(tags, function (item) {
      return matcher.test(item);
    }));
  }
});
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<label for="autocomplete">Select a programming language: </label>
<input id="autocomplete">
...