如何在不刷新整个页面的情况下让 gridview 的单列自动更新？

Question

我有一个包含多列的网格视图，但只有其中一列应该动态更改。每行都有一个“状态”值，我需要调用数据库来更新它。我已经编写了一个函数来执行该调用，但是我编写的用于更新它的当前方法会刷新整个页面。这很突兀，因为刷新会删除状态（页面其他区域中的选定值、滚动位置等）。

这是我编写的尝试设置的代码：

<div class = "my_gridview">
    <asp:Timer ID = "timer_1" OnTick = "timer_1Tick" runat = "server" Interval = "25" />
        <asp:UpdatePanel ID = "update_panel" UpdateMode = "Conditional" runat = "server">
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID = "timer_1" EventName = "Tick" />
        </Triggers>
        <ContentTemplate>
            <asp:GridView ID="my_gridview" runat="server" AutoGenerateColumns = "False" 
                GridLines="None" Width="100%" AllowSorting="True" 
                CssClass="table table-bordered x-condensed cameraDetails" OnRowDataBound = "my_list_RowDataBound"
                EmptyDataText = "There are no generated heatmaps">
                <Columns>
                    <asp:TemplateField meta:resourceKey = "StringSourceID">
                    <HeaderTemplate>
                        <asp:Label ID = "srcTitleLbl" runat="server" Text = "Source" />
                    </HeaderTemplate>
                        <ItemTemplate>
                            <asp:Label ID = "srcLbl" runat="server" CssClass="LinkBtn_Type" meta:resourceKey="srcLblResource" />
                        </ItemTemplate>
                    </asp:TemplateField>

                    <asp:TemplateField meta:resourceKey = "StringStatus">
                    <HeaderTemplate>
                        <asp:Label ID = "statusTitleLbl" runat="server" Text = "Status" />
                    </HeaderTemplate>
                        <ItemTemplate>
                            <asp:Label ID = "statusLbl" runat="server" CssClass="LinkBtn_Type" meta:resourceKey="statusLblResource" />
                        </ItemTemplate>
                    </asp:TemplateField>

                </Columns>
            </asp:GridView>
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>

在不刷新整个页面的情况下如何做到这一点？

Answer 1

UpdatePanel 会进行部分回发，但这仍会经历页面生命周期，这会导致状态被移除。您可以调查诸如项目选择（复选框、行等）之类的持久性内容，但您很可能会花费大量时间来创建它并且维护它将是一场噩梦。

要真正避免页面生命周期并实现您所描述的用户体验，请使用客户端解决方案，例如纯 JavaScript、KnockoutJS、Backbone 或 AngularJS。这些方法将在向服务器发送/检索数据时单独保留您的页面状态，然后可能会更新页面的某些部分。