it-swarm.com.ru

Невозможно установить свойство '_renderItem' неопределенного автозаполнения jQuery UI с HTML

Я использую следующий код для рендеринга элементов автозаполнения пользовательского интерфейса jQuery в виде HTML. Элементы отображаются правильно в элементе управления автозаполнением, но я продолжаю получать эту ошибку JavaScript и не могу пройти дальше.

Firefox Не удалось преобразовать аргумент JavaScript

Chrome Невозможно установить свойство '_renderItem' из неопределенного

  donor.GetFriends(function (response) {
    // setup message to friends search autocomplete
    all_friends = [];
    if (response) {
        for (var i = 0; i < response.all.length - 1; i++) {                
                all_friends.Push({
                    "label":"<img style='padding-top: 5px; width: 46px; height: 46px;' src='/uploads/profile-pictures/" +
                        response.all[i].image + "'/><br/><strong style='margin-left: 55px; margin-top: -40px; float:left;'>" +
                        response.all[i].firstname + " " + response.all[i].lastname + "</strong>",

                    "value":response.all[i].firstname + " " + response.all[i].lastname,
                    "id":response.all[i].user_id});
            }
        }        

    $('#msg-to').autocomplete({
        source:all_friends,
        select:function (event, ui) {               
            // set the id of the user to send a message to
            mail_message_to_id = ui.item.id;
        }

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

Не уверен, почему он выдает эту ошибку, или что я должен сделать, чтобы обойти это ... Любая помощь приветствуется.

67
Carl Weis

Поскольку я только что присоединился и не могу комментировать пост drcforbin выше, я думаю, что мне нужно добавить свой собственный ответ.

drcforbin является правильным, хотя это действительно другая проблема, чем та, что была у OP. Любой, кто придет в эту ветку сейчас, вероятно, столкнется с этой проблемой из-за только что вышедшей новой версии пользовательского интерфейса jQuery. Некоторые соглашения об именах, относящиеся к автозаполнению, были объявлены устаревшими в пользовательском интерфейсе jQuery в v1.9 и полностью удалены в v1.10 (см. http://jqueryui.com/upgrade-guide/1.10/#autocomplete ) ,.

Однако сбивает с толку то, что в них упоминается только переход от item.autocomplete тега данных к ui- autocomplete-item , но тег данных автозаполнения также был переименован в щ-автозаполнение . И это еще более запутанно, потому что демо-версии все еще используют старый синтаксис (и поэтому не работают).

Вот что нужно изменить в функции _renderItem для jQuery UI 1.10.0 в демонстрации пользовательских данных здесь: http://jqueryui.com/autocomplete/#custom-data

Оригинальный код:

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

Фиксированный код:

.data( "ui-autocomplete" )._renderItem = function( ul, item ) {
  return $( "<li>" )
    .data( "ui-autocomplete-item", item )
    .append( "<a>" + item.label + "<br>" + item.desc + "</a>" )
    .appendTo( ul );
};

Обратите внимание на изменения как для автозаполнения , так и item.autocomplete . Я убедился, что это работает в моих собственных проектах.

189
nextgentech

Я столкнулся с той же проблемой ... кажется, в более поздних версиях, это должно быть .data("ui-autocomplete") вместо .data("autocomplete")

26
drcforbin

Я знаю, что опаздываю с ответом, но если люди в будущем все равно не получат

 .data ("ui-autocomplete-item", item) 

работать тогда попробуй этот инстед

$(document).ready(function(){
 $('#search-id').autocomplete({
  source:"search.php",
  minLength:1,       
  create: function () {
   $(this).data('ui-autocomplete')._renderItem = function (ul, item) {
      return $('<li>')
        .append( "<a>" + item.value + ' | ' + item.label + "</a>" )
        .appendTo(ul);
    };
  }
 })
});

У меня это сработало, и у меня возникли проблемы с функцией входа в систему.

 Uncaught TypeError: Невозможно установить свойство '_renderItem' из неопределенного 

Надеюсь, это поможет кому-то :)

/ Кахин

9
Kahin

Я использую jquery 1.10.2, и он работает с помощью:

.data( "custom-catcomplete" )._renderItem = function( ul, item ) {
  return $( "<li>" )
    .data( "ui-autocomplete-item", item )
    .append( "<a>" + item.label + "<br>" + item.desc + "</a>" )
    .appendTo( ul );
};
6
AutoCiudad

И теперь, с jQuery-2.0.0, это имя вашего нового модуля, но заменяет "." (точка) с помощью "-" (тире):

jQuery.widget ('custom.catcomplete', jQuery.ui.autocomplete, {
    '_renderMenu': function (ul, items) {
        // some work here
    }
});

$this.catcomplete({
    // options
}).data('custom-catcomplete')._renderItem = function (ul, item) {}
5
Cyril N.

Публикация ради любого человека, который натыкается на этот пост.

Эта ошибка также проявится, если вы не поместите .autocomplete в событие готовности документа.

Код ниже потерпит неудачу:

<script type="text/javascript">
    $('#msg-to').autocomplete({
        source:all_friends,
        select:function (event, ui) {               
            // set the id of the user to send a message to
            mail_message_to_id = ui.item.id;
        }

    }).data("autocomplete")._renderItem = function (ul, item) {
        return $("<li></li>")
            .data("item.autocomplete", item)
            .append($("<a></a>").html(item.label))
            .appendTo(ul);
    };
</script>

пока код ниже будет работать:

<script type="text/javascript">
    $(function(){
        $('#msg-to').autocomplete({
            source:all_friends,
            select:function (event, ui) {               
                // set the id of the user to send a message to
                mail_message_to_id = ui.item.id;
            }

        }).data("autocomplete")._renderItem = function (ul, item) {
            return $("<li></li>")
                .data("item.autocomplete", item)
                .append($("<a></a>").html(item.label))
                .appendTo(ul);
        };
    });
</script>
3
Johnie Karr

В зависимости от версии jquery ui, которую вы используете, она будет либо "автозаполнение", либо "ui-автозаполнение", я сделал это обновление для плагина combobox, чтобы исправить проблему (~ ln 78-85)

var autoComplete = input.data("ui-autocomplete");
if(typeof(autoComplete) == "undefined")
     autoComplete = input.data("autocomplete");

autoComplete._renderItem = function(ul, item) {

...

1
Michael Angstadt