locked
Accordion Issue with AutoPostback Field... RRS feed

  • Question

  • User523169010 posted

    Hi there,

    Please look at my below code and please let me know why there is a page refresh at autopostback field when updatepanels are in AccordionPane.

    I tested the below code without Accordion there its perfect no page refresh but when enclosing in Accordion and trying then at textbox textchanged event time its reloading the entire page.

    Please help to resolve the issue.

    <cc1:Accordion ID="AddAccordion" RequireOpenedPane="false" SelectedIndex="-1" runat="server" CssClass="accordion"
    HeaderCssClass="accordionHeader"
    HeaderSelectedCssClass="accordionHeaderSelected"
    ContentCssClass="accordionContent" FadeTransitions="True" TransitionDuration="10" Width="860px">
    <Panes>
    <cc1:AccordionPane ID="Abc" runat="server">
    <Header>
    <p>Container One</p>
    </Header>
    <Content>
    <div>

    <asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="server">
    <ContentTemplate>
    <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
    <br />

    <asp:UpdatePanel ID="UpdatePanelChild" UpdateMode="Conditional" runat="server">
    <ContentTemplate>
    <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
    <asp:TextBox ID="TextBox1" runat="server" AutoPostBack="true" OnTextChanged="TextBox1_TextChanged"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
    ErrorMessage="RequiredFieldValidator" EnableClientScript="false" ControlToValidate="TextBox1"></asp:RequiredFieldValidator>
    <asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="InnerButton" />
    </ContentTemplate>
    </asp:UpdatePanel>


    </ContentTemplate>
    <Triggers>
    <asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
    </Triggers>

    </asp:UpdatePanel>
    <asp:Button ID="Button1" runat="server" Text="OuterPanel" OnClick="Button1_Click1"/>
    <br />
    <br />
    <hr />
    <asp:UpdatePanel ID="UpdatePanel2" UpdateMode="Conditional" runat="server">
    <ContentTemplate>
    <asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
    <asp:TextBox ID="TextBox2" AutoPostBack="true" OnTextChanged="TextBox2_TextChanged" runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"
    ErrorMessage="Hona Kuch tobhi idhar" EnableClientScript="false" ControlToValidate="TextBox2"></asp:RequiredFieldValidator>

    <asp:Button ID="Button3" runat="server" Text="AnotherUpdatePanel" />

    </ContentTemplate>
    </asp:UpdatePanel>

    </div>

    </Content>
    </cc1:AccordionPane>

    <cc1:AccordionPane ID="Xyz" runat="server">
    <Header>
    <p>Container Two</p>
    </Header>
    <Content>
    <asp:UpdatePanel ID="UpdatePanelAddCompany" runat="server" UpdateMode="Conditional">


    <ContentTemplate>

    <div class="grad">
    <h1>Add New Vendor Company</h1>
    </div>
    <div class="wrapper">
    <div class="groupitup">
    <asp:Label ID="compidlbl" CssClass="label" AssociatedControlID="compid" Text="Company ID :" runat="server" />
    <asp:TextBox ID="compid" runat="server" CssClass="txtbox disText" Enabled="false" ></asp:TextBox>
    </div>

    <asp:UpdatePanel ID="UpdatePanelCompName" UpdateMode="Conditional" runat="server">
    <ContentTemplate>
    <div class="groupitup">
    <asp:Label ID="compnamelbl" CssClass="label" AssociatedControlID="compname" Text="Company Name :" runat="server" />
    <asp:TextBox ID="compname" runat="server" AutoPostBack="true" OnTextChanged="compname_TextChanged" CssClass="txtbox onlyfortextfiled"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidatorCompName" ValidationGroup="compValidGroup" runat="server"
    ControlToValidate="compname" EnableClientScript="false" ErrorMessage="*Required" ForeColor="#ff9933">

    </asp:RequiredFieldValidator>


    </div>
    </ContentTemplate>
    </asp:UpdatePanel>
    </ContentTemplate>
    </asp:UpdatePanel>
    </Content>
    </cc1:AccordionPane>


    </Panes>


    </cc1:Accordion>

    Friday, June 26, 2015 8:51 AM

Answers

  • User61956409 posted

    Hi mjkhan,

    I tested the below code without Accordion there its perfect no page refresh but when enclosing in Accordion and trying then at textbox textchanged event time its reloading the entire page.

    According to your code, I create the following sample to reproduce your problem, the code works fine on my side. it will not refresh the entire page when TextBox TextChanged Event fires.

    <div>
        <asp:Accordion ID="AddAccordion" RequireOpenedPane="false" SelectedIndex="-1" runat="server" CssClass="accordion"
            HeaderCssClass="accordionHeader"
            HeaderSelectedCssClass="accordionHeaderSelected"
            ContentCssClass="accordionContent" FadeTransitions="True" TransitionDuration="10" Width="860px">
            <Panes>
                <asp:AccordionPane ID="Abc" runat="server">
                    <Header>
                        <p>Container One</p>
                    </Header>
                    <Content>
                        <div>
                            <asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="server">
                                <ContentTemplate>
                                    <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
                                    <br />
                                    <asp:UpdatePanel ID="UpdatePanelChild" UpdateMode="Conditional" runat="server">
                                        <ContentTemplate>
                                            <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
                                            <asp:TextBox ID="TextBox1" runat="server" AutoPostBack="true" OnTextChanged="TextBox1_TextChanged"></asp:TextBox>
                                            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
                                                ErrorMessage="RequiredFieldValidator" EnableClientScript="false" ControlToValidate="TextBox1"></asp:RequiredFieldValidator>
                                            <asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="InnerButton" />
                                            <asp:Label ID="lblresult" runat="server" Text=""></asp:Label>
                                        </ContentTemplate>
                                    </asp:UpdatePanel>
                                </ContentTemplate>
                                <Triggers>
                                    <asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
                                </Triggers>
    
                            </asp:UpdatePanel>
                            <asp:Button ID="Button1" runat="server" Text="OuterPanel" OnClick="Button1_Click1" />
                            <br />
                            <br />
                            <hr />
                            <asp:UpdatePanel ID="UpdatePanel2" UpdateMode="Conditional" runat="server">
                                <ContentTemplate>
                                    <asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
                                    <asp:TextBox ID="TextBox2" AutoPostBack="true" OnTextChanged="TextBox2_TextChanged" runat="server"></asp:TextBox>
                                    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server"
                                        ErrorMessage="Hona Kuch tobhi idhar" EnableClientScript="false" ControlToValidate="TextBox2"></asp:RequiredFieldValidator>
                                    <asp:Button ID="Button3" runat="server" Text="AnotherUpdatePanel" />
                                </ContentTemplate>
                            </asp:UpdatePanel>
                        </div>
                    </Content>
                </asp:AccordionPane>
    
                <asp:AccordionPane ID="Xyz" runat="server">
                    <Header>
                        <p>Container Two</p>
                    </Header>
                    <Content>
                        <asp:UpdatePanel ID="UpdatePanelAddCompany" runat="server" UpdateMode="Conditional">
                            <ContentTemplate>
                                <div class="grad">
                                    <h1>Add New Vendor Company</h1>
                                </div>
                                <div class="wrapper">
                                    <div class="groupitup">
                                        <asp:Label ID="compidlbl" CssClass="label" AssociatedControlID="compid" Text="Company ID :" runat="server" />
                                        <asp:TextBox ID="compid" runat="server" CssClass="txtbox disText" Enabled="false"></asp:TextBox>
                                    </div>
                                    <asp:UpdatePanel ID="UpdatePanelCompName" UpdateMode="Conditional" runat="server">
                                        <ContentTemplate>
                                            <div class="groupitup">
                                                <asp:Label ID="compnamelbl" CssClass="label" AssociatedControlID="compname" Text="Company Name :" runat="server" />
                                                <asp:TextBox ID="compname" runat="server" AutoPostBack="true" OnTextChanged="compname_TextChanged" CssClass="txtbox onlyfortextfiled"></asp:TextBox>
                                                <asp:RequiredFieldValidator ID="RequiredFieldValidatorCompName" ValidationGroup="compValidGroup" runat="server"
                                                    ControlToValidate="compname" EnableClientScript="false" ErrorMessage="*Required" ForeColor="#ff9933">
                                                </asp:RequiredFieldValidator>
                                            </div>
                                        </ContentTemplate>
                                    </asp:UpdatePanel>
                            </ContentTemplate>
                        </asp:UpdatePanel>
                    </Content>
                </asp:AccordionPane>
            </Panes>
        </asp:Accordion>
    </div>
    
    protected void Button1_Click1(object sender, EventArgs e)
    {
        string str = "it's Button1 Click Event";
        lblresult.Text = str;
    }
    
    protected void TextBox1_TextChanged(object sender, EventArgs e)
    {
        string str = "it's TextBox1 TextChanged Event";
        lblresult.Text = str;
    }
    

    Best Regards,

    Fei Han



    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Sunday, June 28, 2015 10:39 PM