asp.net 将 gridview 数据复制到没有回发的文本框（vb）答案

【问题标题】：asp.net copy gridview data to textboxes without postback (vb)asp.net 将 gridview 数据复制到没有回发的文本框（vb）
【发布时间】：2015-01-05 14:13:27
【问题描述】：

我在 asp.net 应用程序中有一个 gridview，数据来自 MySQL 数据库。

每个gridview行有50多个字段，其中大部分是隐藏的，所以gridview上实际显示的只有5个。

当您点击任何一行时，gridview 上该行的所有列上的数据都会被复制到 gridview 下方的各种文本框中。

一切正常，但是每次单击一行时都会出现回发到服务器，这使得显示下面数据的过程相当缓慢。

我想将 gridview 行上每个单元格中的数据直接复制到相应的文本框，而无需进一步的服务器干预。由于我需要的所有数据都在 gridview 上（只是隐藏了），因此我看不到每次单击一行时都必须检查服务器的意义。

如何将数据复制到文本框而不必每次都进行回发？

这是我用来将数据从 gridview 复制到文本框的代码（部分）：

         Protected Sub Gridview1_SelectedIndexChanged(sender As Object, e As EventArgs) Handles GridView1.SelectedIndexChanged

             txtOD_OCC.Text = GridView1.SelectedRow.Cells(17).Text.ToString()
             txtOC_OCC.Text = GridView1.SelectedRow.Cells(18).Text.ToString()
        etc....

End Sub

【问题讨论】：

嗯，您需要使用客户端代码而不是服务器端代码来执行此操作。使用 JavaScript，您将识别您需要的元素（包含值的元素和应该接收值的元素）并将值从一个复制到另一个。或者也许这两个元素都可以预先填充该值并相应地显示/隐藏。但是请注意，如果您要像这样更改GridView 的行为，那么您可能会遇到其他问题。您可能希望完全迁移到另一种网格机制，例如 jQuery DataTables。
@David，我同意 Jquery Datatables 比使用 Gridview 更好，但是，由于我是 asp.net 的新手，我更愿意看看我是否可以先做我想做的事在 Visual Studio 中需要，无需添加 jquery 等。你提到我可以用客户端代码/javascript 来做到这一点......你有我可以看到的示例或链接吗？我在网上查了很多信息，但没有找到任何有意义的信息。
好吧，你说你想先学习原生控件，但你的问题的本质是原生控件不是你想要的。老实说，使用 WebForms 可能会导致大量不必要的回发和不直观的结构。如果您使用 MVC 代替，那么包含 DataTables（或类似的东西）是非常自然的，并且更接近原生功能。
好的，我从您的评论中得知，本机 gridview 控件无法在客户端执行我需要的操作，而无需每次都返回服务器。我想这就是为什么我在互联网上找不到任何关于它的东西的原因。感谢您的指导。

标签： gridview postback

【解决方案1】：

您应该使用 Javascrip（在我的示例 JQuery 中）来获取客户端中的值并将其放入文本框中：
gridView 有一个 ID 和一个属性 ClientIDMode，这导致该 ID 在 Render 中不会改变：

 <asp:GridView ID="grdEmployees" ClientIDMode="Static" AutoGenerateColumns="false" runat="server">
                    <Columns>
                        <asp:BoundField HeaderText="Name" DataField="Name" />
                        <asp:BoundField HeaderText="LastName" DataField="LastName"/>
                        <asp:BoundField HeaderText="Phone" DataField="Phone"/>
                    </Columns>
                </asp:GridView>

之后，添加下一个 JQuery 功能：

<script type="text/javascript">
        $(document).ready(function () {
            $("#grdEmployees tr").click(function () {
                $(this).find('td').each(function (e) {
                    alert($(this).text());
                });
            });
        });
    </script>

此 javascript 将事件添加到“#grdEmployees tr”中的单击（单击 TR -row- 时）。当此事件触发时，使用 javascript 获取网格视图中的每个 TD -column-（呈现为表格）并显示该值。

【讨论】：

这就是我一直在寻找的......将进行一些搜索以使其与我的应用程序一起使用。感谢您的指导。