Question

在其他任何事情之前，请不要因为我是一个盲目地完成整个mvc项目而不是单独开始的菜鸟而拍我。

所以无论如何，我对如何在文本框中实现jquery ui自动完成感到困惑，其中数据来自数据库表。

我尝试使用我在互联网上找到的东西来做这件事，这就是我在jquery函数中提出的：

        $(function (){
        $("#autoCompleteText").autocomplete({
            source: function(request, response) {
                $.ajax({
                    type: "POST",
                    traditional: true,
                    dataType: "json",
                    url: "/Service/jsonAutoComplete",
                    success: function(result) {
                        response($.map(result.d, function (item){
                            return {
                                value: item.ProductName
                            }
                        }))
                    },
                    minLegth: 2
                });
            }
            });
        });

对于我的控制器中的方法，它的外观如下：

public JsonResult jsonAutoComplete(int companyId)
    {
        JsonResult result = new JsonResult();
        Products products = new Products();
        products = db.Products.FirstOrDefault(x => x.CompanyId == companyId);
        int productId = products.Id;
        SelectList select = this._selectFactory.CreateSelectListFromProductsByCompanyId(products.Id, companyId);
        result.Data = new { select = select, productId = productId };
        return result;
    }

我很确定我在这里做错了，因为每当我尝试在我的数据库中键入其中一个产品的前2个字母时都没有任何反应。

另外，$ .map究竟意味着什么？我在网上看到的大多数例子都有这个，所以我认为这是必要的，但我真的不明白它。

Answer 1

您没有发送产品名称。尝试类似的东西：

$("#autoCompleteText").autocomplete({
    source: function(request, response) {
        $.ajax({
            // other settings
            data : {
                name: request.term
            }
            // other settings
        });
    }
});

现在我对您使用的服务器端技术了解不多，但可能您必须这样做：

public JsonResult jsonAutoComplete(string name) {
    // TODO: search for products STARTING with name
    // and return it as a JSON list
}

//编辑

$.map是一个jQuery函数，它将一个数组转换为另一个数组（基于“转换器”函数）。您在大多数示例中都会看到这一点，因为autocomplete插件需要特定格式的数据，而服务器响应时可能会有所不同。例如：

var A = [1,2,3,4,5];
var result = $.map( A, function(el) { return 10+el; } );
// result -> [11,12,13,14,15]

如何在数据来自数据库的文本框中实现自动完成？

1 个答案: