Question

我刚刚为视图添加了自动完成功能。它不起作用，当我将焦点设置在文本框上并键入一个字母时，没有任何显示。我不确定我在这里做错了什么，但这里是代码：

引用的jQuery文件：

<script src="@Url.Content("~/Scripts/jquery-1.8.3.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui.js")"        type="text/javascript"></script>

查看：

$(function () {
    $("#rootcause").autocomplete({
        source: function (request, response) {
            alert("x");
            $.ajax({
                url: "/ServiceEntry/FindRootCause",
                type: "POST",
                dataType: "json",
                data: {
                    searchText: request.searchText,
                    maxResult: 10
                },
                success: function (data) {
                    response($.map(data, function (item) {
                        return {
                            label: item.FullName,
                            value: item.RootCauseName,
                            id: item.Id
                        }
                    }))
                }
            })
        },
        select: function (event, ui) {
            alert(ui.item 
                ? ("You picked '" + ui.item.label + 
                  "' with an ID of " + ui.item.id)
                : "Nothing selected, input was " + this.value
            );
        }
    });
});

<div class="bodyContent">
    <span class="leftContent">@Html.Label("Root Cause")</span>
    <span class="rightContent">
        <input id="rootcause" type="text" />
    </span>
</div>

控制器操作：

[HttpPost]
public JsonResult FindRootCause(string searchText, int maxResult)
{
    var result = RunLog.Domain.Lists.GlobalList.GetRootCause(searchText, maxResult);
    return Json(result);
}

public static List<RunLog.Domain.Entities.RootCause> GetRootCause(string search, int maxResult)
{
    //List<String> list = new List<String>();

    EFDbContext db = new EFDbContext();

    var list = (from rc in db.RootCause
                where rc.RootCauseName.Contains(search)
                orderby rc.RootCauseName
                select rc).ToList();

    return list.Take(maxResult).ToList();
}

Answer 1

尝试调试您是否正在执行操作使用这些

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
<script type="text/javascript">
    $(function () {
        $("#brandname").autocomplete({
            source: "/CAdmin/Stores/Search",
            minLength: 1,
            select: function (event, ui) {
                if (ui.item) {
                    alert(ui.item.value);
                    alert(ui.item.id);
                }
            }
        });
    });
</script>

和控制器功能。

    public JsonResult Search(string term)
    {
        var suggestions = Uow.BrandRepository.All.Where(c => c.BrandName.Contains(term));
        var list = suggestions.Select(i => new { id = i.BrandID, value = i.BrandName }).Take(10).ToList();
        var json = Json(list, JsonRequestBehavior.AllowGet);
        return json;
    }

自动完成不在View中工作

1 个答案: