GridView DropDownList 控件在使用 AJAX 调用删除行后丢失所选值

Question

我正在使用 AJAX 从 GridView 中删除一行，它可以工作。

$('.btnDelete').click(function () {
            var rowsCount = <%=gvLineItems.Rows.Count %>;
            var row = $(this).closest("tr");
            if (rowsCount > 1) {
                $.ajax({
                    type: "POST",
                    url: "f_PromotionForm.aspx/DeleteItem",
                    data: JSON.stringify({ itemId: $(this).attr('id') }),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function(response) {
                        if (response.d) {
                            row.remove();
                        }
                    }
                });
            }
        });

f_PromotionForm.aspx/DeleteItem 是从数据库中删除项目的 WebMethod。

这里是 GridView：

<asp:GridView ID="gvLineItems" runat="server" AutoGenerateColumns="false" DataKeyNames="ID" OnRowDataBound="gvLineItems_RowDataBound" >
 <Columns>
 <asp:TemplateField HeaderText="Item Description">
                <ItemTemplate>
                    <asp:DropDownList ID="dlItemDescription" runat="server" DataValueField="ItemCode" DataTextField="ItemDesc" AppendDataBoundItems="true">
                        <asp:ListItem Text="-- SELECT ITEM --" Value="-1" />
                    </asp:DropDownList>
                </ItemTemplate>
            </asp:TemplateField>
 <asp:TemplateField>
                <ItemTemplate>
                    <input class="btnDelete" type="button" value="Delete" id='<%# Eval("ID") %>' />
                </ItemTemplate>
            </asp:TemplateField>
 </Columns>
</asp:GridView>

问题：

在删除行后的后续回发（例如，通过单击“提交”按钮），删除行位置之后的第一行会丢失其从下拉列表中选择的值（默认值为 -1）。

当我在浏览器中检查 POST 时，正在发送下拉列表中为该行选择的值。其他行中的其余下拉列表不会丢失其选择的值。它只是删除后的第一行中的下拉列表。此外，该行中存在问题的其他字段仍保留其值（为了简单起见，我没有在上面的 Gridview 代码中显示这些字段）。

在由带有事件处理程序的按钮触发的回发时，会发生以下导致问题的事件序列：

Page_Init： Gridview 项目从数据库中加载并数据绑定

 //call to db and fill datatable dt with query results (dt has correct rows & values), then:
 gvLineItems.DataSource = dt;
 gvLineItems.DataBind();

Page_Load：此处不会发生任何影响 Gridview 的事情

事件处理程序：

protected void btnSave_OnClick(object sender, EventArgs e)
{
    SaveForm();
}

private bool SaveForm() {
    foreach(GridViewRow row in gvLineItems.Rows)  //this has the correct number of rows
    {
        DropDownList dlItemDescription = (DropDownList) row.FindControl("dlItemDescription");

        //test2 correctly shows the selected item value
        //except for the first row after the previously deleted row.

        var test2 = dlItemDescription.SelectedItem.Value; //**PROBLEM

        //save stuff...
    }
}

请注意： 一个限制是 GridView 不能使用 ViewState，所以我禁用了它。

问题：

如何防止下拉列表丢失其选定值？

Answer 1

我之前使用过this approach 来帮助处理页面上的后 ajax 内容。很有用。您仍然需要弄清楚如何保存问题下拉列表的值并重新应用该值。您可以将值 pre-POST 保存到页面上的隐藏字段，然后重新应用它，结束 POST。 hth。