1

我正在尝试在 jQuery 中使用自动完成小部件，但是当我开始输入时，它下方没有显示任何内容。我可以说它正在做某事，因为当我键入时，我可以看到页面上的滚动条随着列表变短而变化，但我看不到结果。我的代码如下。对此的任何帮助表示赞赏。

我的控制器方法如下所示：

public ActionResult GetUsers(string query)
    {
        var empName = from u in HomeModel.CombineNames()
                      where u.StartsWith(query)
                      select u.Distinct().ToArray();
        return Json(empName);
    }

我的视图如下所示：

<script type="text/javascript">
$(document).ready(function() {
    $("input#autocomplete").autocomplete({
        source: function(request, response) {
            $.ajax({
                url: '/Home/GetUsers',
                type: "POST",
                dataType: "json",


                data: { query: request.term },
                success: function(data) {
                    response($.map(data, function(item) {
                        return { label: item, value: item };
                    }));
                }
            });
        }
    });
})
</script>
<input  type="text" id = "autocomplete"/>
4

2 回答 2

0

您缺少一些东西，例如渲染项、缓存管理。

代码应如下所示：（假设您的操作返回一个字符串数组）

var cache = {},lastXhr;
            $( "input#autocomplete" ).autocomplete({
                minLength: 4,
                source: function (request, response) {
                    var term = request.term;
                    if (term in cache) {
                        response(cache[term]);
                        return;
                    }
                    var descripcion = new Array();
                    peticion = $.getJSON('/Home/GetUsers',{ query: request.term }, function (data, status, xhr) {
                        for (d in data) {
                            descripcion.push(data[d]);
                        }
                        cache[term] = descripcion;
                        if (xhr === peticion) {
                            response(descripcion);
                        }
                    });
                },
                select: function( event, ui ) {
                    $("input#autocomplete" ).val( ui.item);
                    return false;
                }
            })
            .data( "autocomplete" )._renderItem = function( ul, item ) {
                return $( "<li></li>" )
                    .data( "item.autocomplete", item )
                    .append( "<a>" + item +  " </a>" )
                    .appendTo( ul );
            };
于 2013-03-26T20:20:25.910 回答
0

尝试使用浏览器的检查工具检查滚动条发生变化的区域。如果元素存在，您可能需要对 CSS 进行一些更改，以便您的文本颜色不同于背景颜色（或其他与显示相关的问题）。

于 2013-03-26T16:07:00.717 回答