动态创建的 table 在回发时丢失行

Question

我有一个 table，只有一个 TableHeaderRow 由 5 列（单元格）组成。第一个 cell/column 有一个复选框，我想将其作为代码隐藏中动态创建的行的 "check all"。

Table:

<asp:Table runat="server" ID="tblReports" CssClass="table table-condensed table-bordered">
                    <asp:TableHeaderRow>
                        <asp:TableHeaderCell CssClass="text-center">
                            <asp:UpdatePanel runat="server" ID="updatePanelCheckAllReports" ChildrenAsTriggers="true">
                                <ContentTemplate>
                                    <asp:CheckBox runat="server" ID="cbCheckAllReports" OnCheckedChanged="cb_CheckedChanged" AutoPostBack="true" />
                                </ContentTemplate>
                            </asp:UpdatePanel>
                        </asp:TableHeaderCell>
                        <asp:TableHeaderCell>
                        </asp:TableHeaderCell>
                        <asp:TableHeaderCell CssClass="text-center">
                                <h4>Reports</h4>
                        </asp:TableHeaderCell>
                        <asp:TableHeaderCell CssClass="text-center">
                                <h5>Oldest<br />ONLINE<br />ArchiveDate</h5>
                        </asp:TableHeaderCell>
                        <asp:TableHeaderCell CssClass="text-center">
                                <h5>Newest<br />OFFLINE<br />ArchiveDate</h5>
                        </asp:TableHeaderCell>
                    </asp:TableHeaderRow>
                </asp:Table>

Build_Reports_Table:

using (DBContext dc = new DBContext())
            {
                List<string> reports = dc.Database.SqlQuery<string>("SELECT name FROM sys.tables WHERE name like 'report%history' ORDER BY name").ToList();

                foreach (string report in reports)
                {
                    TableRow tableRow = new TableRow();
                    TableCell tableCellCheckBox = new TableCell();
                    TableCell tableCellLabel = new TableCell();
                    CheckBox checkBox = new CheckBox();
                    Label label = new Label();
                    checkBox.ID = "cb" + report;
                    tableCellCheckBox.Controls.Add(checkBox);
                    label.Text = report;
                    tableCellLabel.Controls.Add(label);
                    tableRow.Cells.Add(new TableCell());
                    tableRow.Cells.Add(tableCellCheckBox);
                    tableRow.Cells.Add(tableCellLabel);
                    tableRow.Cells.Add(new TableCell());
                    tableRow.Cells.Add(new TableCell());
                    tblReports.Rows.Add(tableRow);
                }
            }

cb_CheckedChanged方法：

CheckBox checkBox = (CheckBox)sender;
            if (checkBox.ID == "cbCheckAllReports")
            {
                if (checkBox.Checked)
                {
                    foreach (TableRow tableRow in tblReports.Rows)
                    {
                        if (!(tableRow is TableHeaderRow) && !(tableRow is TableFooterRow))
                        {
                            CheckBox cbReport = (CheckBox)tableRow.Cells[1].Controls[1];
                            cbReport.Checked = true;
                        }
                    }
                }
                else
                {
                    foreach (TableRow tableRow in tblReports.Rows)
                    {
                        if (!(tableRow is TableHeaderRow) && !(tableRow is TableFooterRow))
                        {
                            CheckBox cbReport = (CheckBox)tableRow.Cells[1].Controls[1];
                            cbReport.Checked = false;
                        }
                    }
                }
            }

table 在 Build_Reports_Table 是 Page_Load 中的运行之后构建良好。

问题是，cb_CheckedChanged 触发 "check all" 复选框必须有 AutoPostBack = true。使用该设置，当页面回发时，table 丢失所有那些动态添加的行，并且 table 拥有的只是静态 TableHeaderRow.

我试过在 table 周围放置一个 UpdatePanel，但没有用。因此，我将 UpdatePanel 放在 Checkbox 控件周围，但没有用。两次调试 cb_CheckedChanged 函数时 tblReports.Rows 只有静态 TableHeaderRow 行。

更新

主页上有一个ScriptManager

Answer 1

尝试：仅在第一次加载时构建，而不是在回发时构建。

if(!Page.IsPostBack)
{
    // build reports table.
}

Answer 2

我最终用 jQuery

解决了它

动态创建的 table 在回发时丢失行

Dynamically-created table loses rows on postback

c#

asp.net

checkbox

updatepanel

postback