selectedIndexChanged of gridview inside updatepanel still refresh all of the page

Question

User-1497429768 posted

Hi,
 I have a gridview1 and formview1 and gridview2 inside an updatePanel and other controls. The updatemode is conditional and childrenAsTriggers is set to true
on the updatePanel1. The gridview1 has selected buttons (in a commandField).On clicking the link button inside the grid view
will show the detail in formivew1(master) and gridview2(detail). My question is the form still Causes Full Postback.
How can I avoid this.The following is the code-
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"
                    RenderMode="Inline" ChildrenAsTriggers="False">
                    <Triggers>
                        <asp:AsyncPostBackTrigger ControlID="GridView1"
                            EventName="SelectedIndexChanged"  />
                    </Triggers>
                    <ContentTemplate>
...
<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AllowSorting="True"
                                                    EnableSortingAndPagingCallbacks="true" AutoGenerateColumns="False" CellPadding="4"
                                                    DataKeyNames="voucherno" ForeColor="#333333" GridLines="None" Height="1px" PageSize="12"
                                                    Width="100%" Font-Size="17px" UseAccessibleHeader="False">
                                                    <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                                                      <Columns>
                                                        <asp:TemplateField ShowHeader="False">
                                                            <ItemTemplate>
                                                                <asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="False" CommandName="Select"
                                                                    Font-Size="13px" Text="selected"></asp:LinkButton><asp:Label ID="lbTest" runat="server"
                                                                        Text='Eval("Test")%>' Visible="False"></asp:Label>
                                                            </ItemTemplate>
                                                            <ControlStyle Width="100%" />
                                                            <ItemStyle Width="70px" />
                                                        </asp:TemplateField>

Thanks.

Answer 1

User-271186128 posted

Hi jeff.wenchai,

According to your code and description, I suggest you could refer to the following code:

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>

        <asp:ToolkitScriptManager ID="ToolkitScriptManager2" runat="server"></asp:ToolkitScriptManager>

            <asp:UpdatePanel ID="UpdatePanel3" runat="server">
                <ContentTemplate>
                    <div>
                        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="EmployeeID" DataSourceID="SqlDataSource1">
                            <Columns>
                                <asp:BoundField DataField="EmployeeID" HeaderText="EmployeeID" InsertVisible="False" ReadOnly="True" SortExpression="EmployeeID" />
                                <asp:BoundField DataField="FirstName" HeaderText="FirstName" SortExpression="FirstName" />
                                <asp:BoundField DataField="LastName" HeaderText="LastName" SortExpression="LastName" />
                                <asp:BoundField DataField="City" HeaderText="City" SortExpression="City" />
                                <asp:TemplateField ShowHeader="False">
                                    <ItemTemplate>
                                    <%--    <asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="False" CommandName="Select"
                                            Font-Size="13px" Text="selected"></asp:LinkButton>--%>
                                        <asp:LinkButton ID="lbnSelect" CommandName="Select" CommandArgument='<%# Eval("EmployeeID") %>' OnClick="lbnSelect_Click" runat="server">LinkButton</asp:LinkButton>
                                    </ItemTemplate>
                                </asp:TemplateField>
                            </Columns>
                        </asp:GridView>
                        <br />
                        Details<br />
                        <asp:Label ID="lblResult" runat="server" Text=""></asp:Label><br />

                        <%--  you could change GridView2 to FormView--%>
                        <asp:GridView ID="GridView2" runat="server"></asp:GridView>

                        <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:MyTestDBConnStr %>" SelectCommand="SELECT [EmployeeID], [FirstName], [LastName], [City] FROM [Employees]"></asp:SqlDataSource>
                    </div>
                </ContentTemplate>
            </asp:UpdatePanel>

Code behind:

        protected void lbnSelect_Click(object sender, EventArgs e)
        {
            LinkButton lbn = (LinkButton)sender;
            string id  = lbn.CommandArgument.ToString(); //Get the id
            lblResult.Text = id;

            //Query the database, and bind Gridview 2
            string constr = ConfigurationManager.ConnectionStrings["MyTestDBConnStr"].ToString();
            DataTable dt = new DataTable();
            using (SqlConnection con = new SqlConnection(constr))
            {
                string cmdtext = "SELECT * FROM [Employees] Where [EmployeeID]=@id";
                using (SqlCommand cmd = new SqlCommand(cmdtext, con))
                {
                    con.Open();
                    cmd.Parameters.AddWithValue("@id", id);
                    SqlDataAdapter sda = new SqlDataAdapter(cmd);
                    sda.Fill(dt);
                }
            }

            GridView2.DataSource = dt;
            GridView2.DataBind();
        }

The screenshot:

Best regards,
Dillion

Answer 2

User-1497429768 posted

Hi Dillion,
  I would say it's amazing for me. It's just what I want.

  Thank you for your excellent teaching.

 jeff.wenchai

Answer 3

User-1497429768 posted

Hi,

  I am trying to figure out why the updatepanel1 can't work.Finally,I remove the <xhtmlConformance mode="Legacy" /> section from my web.config file,and the updatepanel1 is work fine.But the child form can't  refresh the parent form and close self.The following is the code- I click the closeButton in child form

Dim script As String = ""
script += "<script language='javascript' type='text/javascript'>"
script += "parent.Refresh();"
script += "parent.close_all();"
script += "</script>"
ClientScript.RegisterClientScriptBlock(GetType(String), "", script)

Why the child form can't  refresh the parent form and close self after I remove the <xhtmlConformance mode="Legacy" /> section from my web.config file.It's so strange. Hope any idea. Thanks.

Answer 4

User-1497429768 posted

Hi,

 I change the following code-

 ClientScript.RegisterClientScriptBlock(GetType(String), "", script)

to this-ScriptManager.RegisterStartupScript(closebutton,me.GetType(), "", script.ToString(),false).

And it's done. Thanks.