Question

在回复的帮助下，我将代码更改为

@Html.TextBoxFor(per => per.Hospital, new { style = "width:220px", @maxlength = "50", data_autocomplete = Url.Action("HospitalList", "Person") })

我的jquery是

$(document).ready(function () {        
    $('input[data_autocomplete]').each(function () {
        var url = $(this).data('autocomplete');
        $(this).autocomplete({
            source: function (request, response) {
                $.getJSON(url, {
                    term: request.term
                }, response);
            }
        });
    });
});

并创建了一个新的Action结果

 public ActionResult HospitalList(string term)
    {
        List<string> result = new List<string>();
        result.Add("Hospital 1");
        result.Add("NYUMC");
        result.Add("Christ");
        result.Add("Bellevue");
        result.Add("NewYork-Presbyterian");
        result.Add("North Central Bronx Hospital");            

        return Json(result , JsonRequestBehavior.AllowGet);
    }

现在我要去哪儿了。我只看到一个文本框，没有自动完成的行为。我应该包括任何jquery库以使其工作

Answer 1

您尚未显示正在使用的自动完成插件。如果是jQuery UI autocomplete，您可以从控制器操作中将过滤后的结果作为JSON返回：

[HttpGet]
public ActionResult PersonSearch(string term)
{
    // The term parameter will contain the value entered by the user in the textbox.
    // here you could use it and query your database in order to filter the results.
    string[] result = new string[]
    {
        "filtered value 1",
        "filtered value 2",
        "filtered value 3",
        "filtered value 4",
    };

    return Json(result, JsonRequestBehavior.AllowGet);
}

最后你会附上插件：

$(function() {
    $('input[data-autocomplete]').each(function() {
        var url = $(this).data('autocomplete');
        $(this).autocomplete({
            source: function(request, response) {
                $.getJSON(url, {
                    term: request.term
                }, response);
            }
        });
    });
});

注意控制器操作如何获取term参数，并应将字符串列表作为JSON返回。

url.action自动完成

1 个答案: