jQuery UI 自动完成未使用文本填充 select 列表

Question

我正在使用 jQuery UI 自动完成并使其部分工作。当没有找到结果时，它会毫无问题地显示我的 "No results found." 消息，但是当找到结果时，它只会为每个选项显示一个空框，根本没有文本。

我已经调试，但开发人员控制台中没有显示任何内容，我可以深入研究我的 ASP.Net 代码并查看正在提取的有效数据。我在这里错过了什么？

jQuery:

$("#ProjectSearchBox").autocomplete(
{
    minLength: 3,
    source: function(request, response)
    {
        $.ajax(
        {
            cache: false,
            type: "GET",
            url: "/Timesheet/ProjectCodes?searchTearm=" + request.term,
            success: function(data)
            {
                response(data);
            },
            error: function(xhr)
            {
                alert("Error getting project list, please try again later.");
            }
        });
    }
});

HTML:

<li>
    <label for="ProjectSearchBox">Search Project:</label>
    <input type="text" id="ProjectSearchBox" name="ProjectSearchBox" list="ProjectList" />
</li>

ASP.Net代码：

    var projects = db.ProjectCodes
                        .Where(project => project.Code.ToLower().Contains(searchTearm.ToLower()) || project.Description.ToLower().Contains(searchTearm.ToLower()))
                        .Select(project => new
                        {
                            projectInfo = string.Concat(project.Code, " | ", project.Description)
                        }).ToList();

    if (projects.Count == 0)
    {
        return Json(new { responseText = "No match found." }, JsonRequestBehavior.AllowGet);
    }
    else
    {
        return Json(projects, JsonRequestBehavior.AllowGet);
    }

Answer 1

您的控制器没有返回数组或字符串，而是返回一个对象数组，其中包含一个名为 "projectInfo" 的字符串属性。如果没有进一步的说明，自动完成功能不知道如何解析它。将服务器代码的 select 行更改为：

.Select(project => string.Concat(project.Code, " | ", project.Description))

jQuery UI 自动完成未使用文本填充 select 列表

jQuery UI autocompleate not populating select list with text

asp.net-mvc

jquery-ui

jquery-ui-autocomplete