c# - 表单中的自动完成字段？[]

Question

我使用 c# MVC3 & razor、Entity Framework 和 Linq。

我有一个表单，有两个字段，第一个是Client ID ，第二个是Store Name。我想，当用户输入 ID 时，我的 StoreName 字段会自动填充......数据将来自存储这两个数据的数据库。

Answer 1

你可以使用 AJAX。因此，设置一个以客户端 ID 作为参数的控制器操作，它将查询您的数据库并将相应的商店名称作为 JSON 结果返回。然后订阅.blur包含商店 id 的文本输入的事件并向控制器操作发送 AJAX 调用以填充第二个输入字段。

是的，我知道，毫无意义的jibber-jabber，给我codez。

这里：

public ActionResult GetStoreName(int clientId)
{
    // of course thath's just an example here. I have strictly no idea
    // what database access technology you are using, how your models look like
    // and so on. Obviously you will have to adapt this query to your data model.
    var client = db.Clients.FirstOrDefault(x => x.Id == clientId);
    if (client == null)
    {
        return HttpNotFound();
    }

    return Json(new { storeName = client.Store.Name }, JsonRequestBehavior.AllowGet);
}

现在假设以下视图：

<div>
    @Html.LabelFor(x => x.ClientId)
    @Html.TextBoxFor(x => x.ClientId, new { id = "clientId", data-url = Url.Action("GetStoreName") })
</div>
<div>
    @Html.LabelFor(x => x.Store.Name)
    @Html.TextBoxFor(x => x.Store.Name, new { id = "storeName" })
</div>

在一个单独的 javascript 文件中，您可以订阅.blur第一个文本框的事件，并触发向控制器发送 AJAX 请求，将用户输入的客户端 ID 发送给控制器。在成功回调中，您将使用 AJAX 调用的结果更新第二个文本字段：

$(function() {
    $('#clientId').blur(function() {
        var clientId = $(this).val();
        $.ajax({
            url: $(this).data('url'),
            type: 'GET',
            cache: false,
            data: { clientId: clientId },
            success: function(result) {
                $('#storeName').val(result.storeName);
            }
        });
    });
});