在 C# 的中继器中选择 CheckBox 时如何避免页面刷新？答案

【问题标题】：How to avoid a page refresh when CheckBox selected in repeater in C#?在 C# 的中继器中选择 CheckBox 时如何避免页面刷新？
【发布时间】：2017-03-13 08:30:36
【问题描述】：

在带有转发器控件的asp.net网页中，当我在标题中选择一个复选框以选中项目模板行中的所有复选框时，如何避免完整的页面刷新？

我的项目基于asp.net C#，以SQL Server为数据库。

        <asp:Repeater ID="Repeater_product_detail" runat="server" OnItemCommand="Repeater_product_detail_ItemCommand" OnItemDataBound="Repeater_product_detail_ItemDataBound">
    <HeaderTemplate>
        <table  class="table table-striped table-bordered ">
            <thead>
                <tr>
                              <td> <asp:CheckBox ID="chk_select" AutoPostBack="true" runat="server" OnCheckedChanged="chk_select_CheckedChanged"/> </td>
                              <th>SubCategory</th>
                              <th>Product Name</th>
                              <th>Product image</th>
                              <th>Product Price</th>
                              <th>in stock</th>
                              <th>Type for</th>
                              <th>Action</th>
                   </tr>                  
            </thead>
            <tbody>

    </HeaderTemplate>
    <ItemTemplate>
        <tr>
            <td>  
                 <asp:CheckBox ID="chkDelete" AutoPostBack="true"  runat="server" /> 
                 <asp:Label ID="lbl_id" Visible="false" runat="server" Text='<%# ("int_product_id") %>'></asp:Label>
            </td>
             <td> 
                 <asp:Label ID="lbl_sub_cate" runat="server" Text='<%# Eval("txt_sub_category_name") %>'></asp:Label>
                 <asp:DropDownList ID="ddl_sub_category" Width="100px" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "txt_sub_category_name") %>' runat="server" Visible="false" > </asp:DropDownList>

             </td>

            <td> <asp:Label ID="lbl_product_name" runat="server" Text='<%# Eval("txt_product_name") %>'></asp:Label>
            <asp:TextBox ID="txt_product_name" BackColor="#d4d0c8" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "txt_product_name")%>' Visible="false"></asp:TextBox>
            </td>

            <td> <%--<asp:Label ID="lbl_product_image" runat="server" Text='<%# Eval("product_img_small") %>'></asp:Label>--%>
                  <asp:Image ID="Image1" Height="50px" Width="50px" ImageUrl='<%# Eval("product_img_small") %>' runat="server" />
            </td>


            <td> <asp:Label ID="lbl_product_price" runat="server" Text='<%# Eval("txt_product_price") %>'></asp:Label>
             <asp:TextBox ID="txt_product_price" Width="60px" BackColor="#d4d0c8" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "txt_product_price")%>' Visible="false"></asp:TextBox>
            </td>
            <td> <asp:Label ID="lbl_stock" runat="server" Text='<%# Eval("in_stock") %>'></asp:Label>
             <asp:TextBox ID="txt_stock" BackColor="#d4d0c8" Width="60px" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "in_stock")%>' Visible="false"></asp:TextBox>
            </td>
            <td> <asp:Label ID="lbl_type" runat="server" Text='<%# Eval("cate_type") %>'></asp:Label>
            <asp:DropDownList ID="ddl_type" runat="server" Width="60px" DataTextField="cate_type" Visible="false"></asp:DropDownList>
            </td>
            <td>
                <asp:LinkButton ID="lnk_edit" CommandArgument='<%# Eval("int_product_id") %>' CommandName="edit" runat="server">Edit</asp:LinkButton>
                 <asp:LinkButton ID="lnk_update" CommandArgument='<%# Eval("int_product_id") %>' Visible="false" CommandName="update" runat="server">Update</asp:LinkButton>
                 <asp:LinkButton ID="lnk_cancel" CommandArgument='<%# Eval("int_product_id") %>' Visible="false" CommandName="cancel" runat="server">Cancel</asp:LinkButton>
                 <asp:LinkButton ID="lnk_delete" CommandArgument='<%# Eval("int_product_id") %>' CommandName="delete" OnClientClick='javascript:return confirm("Are you sure you want to delete?")'  runat="server">Delete</asp:LinkButton>

            </td>


        </tr>
    </ItemTemplate>

    <FooterTemplate>
             <tr style="background-color:#15880a">
             <td colspan="8"> 
        </tbody>
      </table>
    </FooterTemplate>

</asp:Repeater>
<asp:LinkButton ID="lnk_del_selected" CommandArgument='<%# Eval("int_product_id") %>'  OnClientClick='javascript:return confirm("Are you sure you want to delete?")' runat="server" OnClick="lnk_del_selected_Click">Deleted Selected</asp:LinkButton>

隐藏代码

      protected void chk_select_CheckedChanged(object sender, EventArgs e)
{
    Control header_control = Repeater_product_detail.Controls[0].Controls[0];   // Find header Template's Items

    CheckBox chk = header_control.FindControl("chk_select") as CheckBox;
    if (!chk.Checked)
            {
                toggleCheckState(false);
            }
            else
            {
                toggleCheckState(true);
            }
}

public void toggleCheckState(bool checkstate) {

   foreach (RepeaterItem item in Repeater_product_detail.Items)   // Find Item Template's Items
   {
       if (item.ItemType == ListItemType.AlternatingItem || item.ItemType == ListItemType.Item)
       {
           CheckBox chk_delete = (CheckBox)item.FindControl("chkDelete");
           chk_delete.Checked = checkstate;
       }
   }

【问题讨论】：

请分享你的代码。

标签： c# asp.net

【解决方案1】：

在复选框属性中设置AutoPostBack="false"。

【讨论】：

【解决方案2】：

我相信你的问题的症结在于：

“当我从下拉列表中选择任何值时，我会从数据库中加载一些取决于此选定值的数据，每当刷新选择更改页面时，我都会遇到问题。”

有很多方法可以实现这一点，但可能需要进行一些重组才能产生预期的效果。一个相对简单的方法是：

 <asp:UpdatePanel runat="server" id="UpdatePanel" updatemode="Conditional">
            <ContentTemplate>
               <asp:CheckBox ID="chk_select" AutoPostBack="true" runat="server" OnCheckedChanged="chk_select_CheckedChanged"/>                  
           </ContentTemplate>
           <Triggers>
                <asp:Asyncpostbacktrigger controlid="chk_select" eventname="SelectedIndexChanged" />
           </Triggers>
 </asp:UpdatePanel>

【讨论】：

【解决方案3】：

在复选框上将 AutoPostBack 属性设置为 false。

【讨论】：

【解决方案4】：

前面的答案几乎是正确的，除了 ASP.NET 复选框没有 SelectedIndexChanged 事件。应该是 CheckedChanged

<asp:UpdatePanel runat="server" id="UpdatePanel" updatemode="Conditional">
    <ContentTemplate>
       <asp:CheckBox ID="chk_select" AutoPostBack="true" runat="server" OnCheckedChanged="chk_select_CheckedChanged"/>                  
    </ContentTemplate>
    <Triggers>
        <asp:Asyncpostbacktrigger controlid="chk_select" eventname="CheckedChanged" />
    </Triggers>
</asp:UpdatePanel>

【讨论】：

【解决方案5】：

设置checkbox的Autopostback属性值导致postback变为false

【讨论】：

我做到了.. 但是复选框在设置回发'false'后没有响应

【解决方案6】：

您可以将 CheckBox 的 AutoPostBack 属性设置为 false，或者您也可以使用 Ajax UpdatePanel 控件并将您的 CheckBox 放入其中，这样整个页面将不会重新加载，并且只会刷新复选框值。

【讨论】：

在 AJAX 扩展选项卡内的工具箱中，您将找到 UpdatePanel 控件。里面可以放Repeater控件。
谢谢@netX 它的工作。但是有一个问题.. 当我运行特定的一页项目然后轻松运行.. 但是当我使用 F5 键运行整个项目时出现错误（错误：未知的服务器标签更新面板，脚本管理器）