在C＃的中繼器中選中CheckBox時，如何避免頁面刷新？

Question

在帶有轉發器控件的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;
       }
   }

Answer 1

在復選框屬性中設置AutoPostBack="false" 。

Answer 2

在復選框上將AutoPostBack屬性設置為false。

Answer 3

我認為，您的問題的症結在於：

“當我從下拉列表中選擇任何值時，我會從數據庫中加載一些依賴於此選定值的數據，每當刷新選擇更改頁面時，我都會遇到問題。”

有許多方法可以完成此操作，但是可能需要進行一些重組才能產生所需的效果。 一個相對簡單的方法是：

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

Answer 4

設置checkbox的Autopostback屬性的值，該屬性導致postback為false

Answer 5

您可以將CheckBox的AutoPostBack屬性設置為false，否則也可以使用Ajax UpdatePanel控件並將CheckBox放在其中，這樣就不會重新加載整個頁面，並且僅刷新復選框的值。

Answer 6

前面的答案幾乎是正確的，除了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>