Question

基本上，我有一个带有id（主键）和名字的MySQL表。当用户在网络表单的“ID”文本框中输入一个数字时，我想更新另一个文本框，其名称基于输入的ID。最好的方法是什么？

我目前正在做的事情非常愚蠢，但它确实有效。当我的页面加载时，我将id和name拉入DataTable对象。然后，当文本框发生更改（TextChanged event）时，我会回发到服务器，然后搜索我的数据表并更改名称文本框的值。

它有效，但由于回发而有点慢。我觉得这可以通过javascript使表单感觉更具响应性？但我甚至不确定要google什么。有什么提示吗？

Answer 1

您应该使用JavaScript。无需回发到服务器。

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.1.min.js"></script>
<script>
$(document).ready(function ()
    {
        $('input[name="txtid"]').on('change keyup',function()
        {
            $('input[name="txtnotifications"]').val
            (
                $('input[name="txtid"]').val()
            );
        });
});
</script>
</head>

<body>
<form action="/">
  <input name="txtid" type="text" />
  <br />
  <input name="txtnotifications" type="text" />
</form>

此外，用户输入ID似乎很奇怪。这通常是数据库管理的字段，用户无法创建/更新它。

Answer 2

如果酒店表很小，请拉出所有记录并渲染为javascript数组对象。

<script src="Scripts/jquery-1.9.1.min.js"></script>

<input id="txtID" type="text" runat="server" />
<input id="txtName" type="text" runat="server" />

<script type="text/javascript">
    $(function () {
        $('#<%= txtID.ClientID%>').on('change keyup', function () {
            var result = $.grep(hotels, function (e) { return e.id == $('#<%= txtID.ClientID%>').val(); });
            var output;

            if (result.length == 0) {
                // not found
                output = 'Hotel not found!!!';
            } else if (result.length == 1) {
                // access the foo property using result[0].foo
                output = result[0].name;
            } else {
                // multiple items found
                output = 'Multiple hotels found!!!';
            }

            $('#<%= txtName.ClientID%>').val(output);
        });
    });
</script>

在后面的代码中，您需要做的是将记录呈现为序列化的JSON字符串：

Private Sub rendertHotelList()
    Dim dt As DataTable = ... ' read hotel data from db into datatable

    Dim hotels = From row As DataRow In dt.AsEnumerable
                 Select id = CStr(row!EmployeeID), name = row!LastName

    Dim jss As New Script.Serialization.JavaScriptSerializer
    Dim s As String = jss.Serialize(hotels)

    ClientScript.RegisterClientScriptBlock(GetType(Page), "hotel_array", "var hotels = " & s, True)

End Sub

这样，当用户输入id值时，不需要回发到服务器。

但是，如果表包含大量记录，并且您需要保持页面大小尽可能小，请使用ajax请求来检索名称。

根据一个文本框中的输入，查询MySQL数据库并更新另一个文本框

2 个答案: