Подтвердить что ты не робот

JQuery Autocomplete.data( "автозаполнение" ) - undefined

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

.data("autocomplete") is undefined

Как бы то ни было, если я удаляю метод .data() с конца, он отлично работает (только с настраиваемой графикой, которую предоставляет .data()). Может ли кто-нибудь сказать мне, что происходит не так?

$("input#testInput").bind("autocompleteselect", function (event, ui) {

  }).autocomplete({
      appendTo: "#autoCompList",
      source: function (request, response) {
          $.ajax({

              url: JSONP CALL URL
              dataType: "jsonp",
              data: {
                  featureClass: "P",
                  style: "full",
                  maxRows: 12,
                  name_startsWith: request.term
              },
              success: function (data) {
                  response($.map(data.data, function (item) {
                      fbPageJson = item;
                          return {
                              label: item.name,
                              image: item.picture,
                              json: item,
                          }
                  }));
              },
          });
      }

  }).data("autocomplete")._renderItem = function (ul, item) {
      return $("<li></li>").data("item.autocomplete", item).append("<a><img src='" + item.image + "' alt='no photo'/></a>" + item.label).appendTo(ul);
  };
4b9b3361

ОТВЕТЫ

Ответ 1

У меня была такая же проблема и на основе версии jQuery u1.10.0, я думаю, вам стоит попробовать

data('uiAutocomplete')

вместо

data('autocomplete')

Основываясь на комментарии Джонни, я проверил, как работает функция .data(). Да, jQuery возвращает null из вызова .data(), когда селектор не находит никаких элементов.

Итак, если для вашего селектора нет соответствующего элемента, то объект создания автозаполнения не создается и не добавляется в пользовательский объект данных.

Итак, лучше сделать это:

    $(selector).autocomplete({ your autocomplete config props here });
    if ( $(selector).data() ) {

    // some jQueryUI versions may use different keys for the object. so to make sure,
    // put a breakpoint on the following line and add a watch for $(selector).data(). 
    // then you can find out what key is used by your jQueryUI script.

        var ac = $(selector).data('uiAutocomplete');
        if ( ac ) {
           // do what you want with the autoComplete object. below is the changed version of an example from jqueryUI autocomplete tutorial

           ac._renderItem = function(ul, item) {
                return $("<li>")
                    .append("<a>" + item.label + "</a>")
                    .appendTo(ul);
            };
        }
    }

Ответ 2

data('ui-Autocomplete') разрешил мои проблемы. Я думаю, что это от jquery 1.7 с jquery-ui 1.8. data('autocomplete') было нормально. Тот же script с последней версией этих файлов не работает.

Ответ 3

Я нашел решение!

Некоторые люди считают, что "ui-autocomplete" неверно, поэтому они используют "автозаполнение" или "uiAutocomplete", но это неправильно. Собственно, "ui-autocomplete" - это правильный способ сделать это.

У меня такая же проблема, и у меня есть проблема с этим кодом. Вместо этого:

.data('ui-autocomplete')._renderItem = function (ul, item) {
       if (!_.include(self.idArr, item.id)) {
            return $('<li></li>').data('ui-autocomplete-item', item).append('<a>' + item.name + '</a>').appendTo(ul);
            }
    };

Использование:

._renderItem = function (ul, item) {
      if (!_.include(self.idArr, item.id)) {
         return $('<li></li>').data('ui-autocomplete-item', item).append('<a>' + item.name + '</a>').appendTo(ul);
           }
       };

Я думаю, что combobox и autocomplete возвращают данные ('ui-autocomplete'), поэтому, если вы введете .data('ui-autocomplete'), вы делаете что-то вроде:

.data('ui-autocomplete').data('ui-autocomplete')

Что плохого.... ну, на самом деле я не знаю, почему это не работает и почему без этого работает, но поверьте мне, удалите .data('ui-autocomplete') и будьте счастливы!

Ответ 4

Фактически в вашей функции успеха вы вызываете response и возвращаете объект, например

return {
           label: item.name,
           image: item.picture,
           json: item,
       }

но в следующей строке

return $("<li></li>").data("item.autocomplete", item).append("<a><img src='" + item.image + "' alt='no photo'/></a>" + item.label + " Number of Likes: " + item.likes).appendTo(ul);

вы используете item.likes, который недоступен в возвращаемом объекте, поэтому проблема. Я думаю, вы можете использовать его как

success:function(data) {
    var result = $.map(data, function (item){
    return {
            label: item.name,
            image: item.picture,
            item.likes 
        };
    });
    response(result);
}

Также сохраняйте item.label внутри <a></a> (это может быть не причиной ошибки), например

return $("<li></li>").data("item.autocomplete", item).append("<a><img src='" + item.image + "' alt='no photo'/>"+item.label+"</a>").appendTo(ul);

и убедитесь, что в следующей строке

$.map(data.data, function (item) // notice data.data

должен ли он быть data.data или только data. Вы также можете удалить json: item из объекта, потому что вы не использовали его нигде, насколько мне известно.

Обновление: Изменить следующую строку

.data("autocomplete")._renderItem = function (ul, item) {...};

к

.data("autocomplete")?._renderItem = function (ul, item) {...}; // notice the ? mark

или

if(typeof $('#Your_Input_Id').val()!="undefined")
{
    $('#Your_Input_Id').autocomplete({....});
}

или

var mydata=$('#Your_Input_Id').autocomplete(...).data('autocomplete');
if(mydata)
    mydata._renderItem = function (ul, item) {...};

Ответ 5

Если вы посмотрите на последний пример combobox на демонстрации сайта, вы увидите, что они используют данные ('ui-Autocomplete'). Я столкнулся с той же проблемой, что и вы. Ранее я использовал jquery-1.6.2 и jquery-ui-1.8.16. Как только я обновил свои файлы до jquery-1.9.1 и jquery-ui-1.10.0, ошибка была исправлена. Я предполагаю, что более старый jquery-ui автозаполнение не устанавливало свойство data ('ui-Autocomplete'), поэтому при извлечении оно было null/ undefined. Надеюсь, это поможет другим людям, поскольку вы, вероятно, уже исправили проблему.

Ответ 6

Вы можете реализовать указанную ниже строку

.autocomplete( "instance" )._ renderItem = function (ul, item) {

instate

.data( "autocomplete" )._ renderItem = function (ul, item) {

в соответствии с документацией, доступной на сайте JQuery JQuery AutoComplete Documentation и примером, вы найдете этот код.

из обновленной версии jquery 1.10 они внесли изменения в код. надеюсь, это поможет вам.