Question

我有一个表，其中只有一个TableHeaderRow由5列（单元格）组成。第一个单元格/列具有一个复选框，我希望对后面代码中动态创建的行进行“全部检查”。

表格：

<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;
                        }
                    }
                }
            }

在Page_Load中运行Build_Reports_Table后，表可以正常构建。

问题是，要使cb_CheckedChanged触发“全部选中”复选框，必须具有AutoPostBack = true。设置好该设置后，当页面回发时，表将丢失所有那些动态添加的行，并且所有表都具有静态TableHeaderRow。

我尝试将UpdatePanel放在桌子上，但是没有用。因此，然后我将UpdatePanel置于Checkbox控件周围，但这没用。两次调试cb_CheckedChanged函数tblReports.Rows时都只有静态TableHeaderRow行。

更新

主页上有一个ScriptManager

Answer 1

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

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

Answer 2

我最终用jQuery解决了

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

2 个答案: