TypeError: $(...).autocomplete(...).data(...) is undefined

Question

I found error when using jQuery autocomplete.

This notice error in console is

TypeError: $(...).autocomplete(...).data(...) is undefined }).data( "ui-autocomplete" )._renderItem = function( ul, item ) {

Code:

Site Name <br/>

<input type="text" name="site_name" id="site_name"><br/>

<input type="hidden" name="site_id" id="site_id">

$().ready(function () {
    $("#site_name").autocomplete({
        source: function (request, response) {
            $.ajax({
                url: "get_site2.php",
                dataType: "json",
                data: {
                    term: request.term
                },
                beforeSend: function () { // add this
                    showLoading("remove");
                    console.log("remove");
                },
                success: function (data) {
                    response(data);
                }
            });
        },
        minLength: 2,
        select: function (event, ui) {
            $("#site_name").val(ui.item.label);
            $("#site_id").val(ui.item.name);
            return false;
        },
        open: function () {
            $(this).removeClass("ui-corner-all").addClass("ui-corner-top");
        },
        close: function () {
            $(this).removeClass("ui-corner-top").addClass("ui-corner-all");
        }
    }).data("ui-autocomplete")._renderItem = function (ul, item) {
        return $("<li></li>")
            .data("ui-autocomplete-item", item)
            .append("<a>" + item.label + "</a>")
            .appendTo(ul);
    };

});

I confused, I already search and try this question but it did not fix it.

You're getting an error because the `autocomplete` widget constructor doesn't return correctly. This is most likely because `$("#site_name")` doesn't select the correct HTML element. Try using the proper ready handler signature, and make sure that `$("#site_name")` selects the right `` tag — blgt, Jun 19 '15 at 10:23

score 5 · Accepted Answer · answered Oct 26 '16 at 21:42

Sorry this fix might be a bit late .. but for the other guys running into this problem.

just change

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

to

})._renderItem = function (ul, item) {

This should resolve the issue.

In some cases it will look like this

.autocomplete().data("uiAutocomplete")._renderItem =  function( ul, item )

Change it to

.autocomplete()._renderItem = function( ul, item )

score 1 · Answer 2 · answered Dec 21 '18 at 13:43

1

This helped me:

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

answered Dec 21 '18 at 13:43

JeSa

559
4
11

TypeError: $(...).autocomplete(...).data(...) is undefined

2 Answers2

Linked