jQueryUI自动完成不会向用户显示超过10个结果

时间:2011-08-31 09:12:41

标签: jquery jquery-ui autocomplete

我目前正在使用jquery-ui-1.8.10 我正在使用自动完成组件,并且无法在文档中找到任何方式来配置它以向用户返回10个以上的结果,即使该列表从服务器返回的结果超过10个。 http://jqueryui.com/demos/autocomplete/

这是一个类似的帖子,但是max对我来说不起作用,感觉就像他正在使用jQueryUI中自动完成的其他组件,即使他说他是。 jQuery autocomplete won't show more than 10 results

如何配置组件以向用户显示10个以上的结果?

$("#module-name-search").autocomplete({
        source: "service/searchForModule?langCode=" + langCode,
        minLength: 3,
        max: 50,
        select: function(event, ui){
            $("#module-code-search").val(ui.item.id);
            $("#module-name-search").val(ui.item.text);

            return false;
        }
    }).data("autocomplete")._renderItem = function(ul, item){
        return $("<li></li>").data("item.autocomplete", item).append("<a style='font-size:9px;'>" + item.text + "</a>").appendTo(ul);
    };

1 个答案:

答案 0 :(得分:0)

我找到了解决问题的方法......下面张贴的是代码。

$("#module-name-search").autocomplete({
        source: function( request, response ) {
            if (searchAjax != null) {
            searchAjax.abort();
        }
        searchAjax = $.ajax({
                url: "service/searchForModule?langCode=" + langCode,
                dataType: "json",
                data: {
                    term: encodeURI(request.term),
                    iTipeProgram: $("#prog-type-input").val()
                },
                success: function( data ) {
                    //alert(data);
                    response( data );
                }
            });
        },
        minLength: 3,
        select: function(event, ui){
            $("#module-code-search").val(ui.item.id);
            $("#module-name-search").val(ui.item.text);

            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("autocomplete")._renderItem = function(ul, item){
        return $("<li></li>").data("item.autocomplete", item).append("<a style='font-size:9px;'>" + item.text + "</a>").appendTo(ul);
    };