Javascript 如何自定义在autocomplete（）UI中找到的项目？

我正在尝试更改在对话框中使用此自动完成wigide时，找到的项目在对话框中的显示方式

我尝试像下面的代码一样使用“\u renderMenu”属性，但找到的项显示为空，没有数据

这是我的密码

$("#icwsTransferTo").autocomplete({
    minLength: 2,
    source: function(request, response) {

        $.ajax({    
            type: 'GET',
            url: 'index.php',       
            data: {method: 'userSearch', term: request.term},
            dataType: 'json',
            cache: false,
            timeout: 30000,
            success: function(data) { 

            if(!data){
                    return;
                }

                var allFound = $.map(data, function(m) {
                return {
                        'name': m.configurationId.displayName,
                        'ext': m.extension,
                        'id': m.configurationId.id
                    };
                });

                response(allFound);

            }
        }); 

    },
    select: function( event, item) {

        alert(item.value + ' was selected!!!');

    },
    '_renderItem': function (ul, item) {
        return $( "<li>" ).attr( "data-value", item.id)
            .append( '<span>' + item.name+ '</span><span style="float: right"> (' + item.ext + ')</span>' )
            .appendTo( ul );
    }
});

我想出来了

这是所有正在搜索的人的新代码。我发现这是一个很好的资源

$.widget("custom.autoCompleteUserList", $.ui.autocomplete, {
    _renderItem: function (ul, item ) {

        if(item.ext != 'undefined' && typeof item.ext !== 'undefined'){
            var label = '<div class="ui-autocpmplete-item-wrapper"><span class="ui-autocpmplete-item-name-span">' + item.name + '</span><span class="ui-autocpmplete-item-ext-span"> (ext. ' + item.ext + ')</span></div>';
        } else {
            var label = '<div class="ui-autocpmplete-item-wrapper">' + item.name + '</div>';
        }

        return $( "<li>" )
            .attr( "data-value", item.id )
            .append( label)
            .appendTo( ul );
    }
});

$("#icwsTransferTo")
// don't navigate away from the field on tab when selecting an item
.bind( "keydown", function( event ) {
    if ( event.keyCode === $.ui.keyCode.TAB &&
        $( this ).autoCompleteUserList( "instance" ).menu.active ) {
      event.preventDefault();
    }
  }).autoCompleteUserList({
    minLength: 2,
    source: function(request, response) {

        $.ajax({    
            type: 'GET',
            url: 'index.php',       
            data: {method: 'userSearch', term: request.term},
            dataType: 'json',
            cache: false,
            timeout: 30000,
            success: function(data) { 

                if(!data){
                    return;
                }

                var finalSource = $.map(data, function(m) {
                return {
                        'name': m.configurationId.displayName,
                        'ext': m.extension,
                        'id': m.configurationId.id
                    };
                });

                response(finalSource);

            }
        }); 

    },
    focus: function() {
        // prevent value inserted on focus
        //return false;
    },
    select: function( event, ui ) {
            console.log(ui.item);
        alert(ui.item.value + ' < > ' + ui.item.label + ' was selected!!!');

    }
})