Problem in update panel

Hi

I am applying Ajax on an aspx page. Please see the code section. But when I click on submit button, page still got submitted.

Am I missing something?

Regards
Karan Gupta
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CategoryAdmin.aspx.cs" Inherits="Admin_CategoryAdmin" %>
 
<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
    Namespace="System.Web.UI" TagPrefix="asp" %>
<%--<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="AjaxToolKit" %>--%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Category Admin</title>
</head>
<body>
    <form id="frmCategoryAdmin" runat="server">
        <asp:ScriptManager EnablePartialRendering="true"  ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <table align="center">
                    <tr>
                        <td align="center" colspan="2">
                            <asp:Label ID="lblHeading" runat="server" Text="Category"></asp:Label>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2">
                            &nbsp;
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2" align="center">
                            <asp:Label ID="lblMessage" runat="server"></asp:Label>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2">
                            &nbsp;
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="lblCategoryName" Text="Category Name" runat="server"></asp:Label>
                        </td>
                        <td>
                            <asp:TextBox ID="txtCategoryName" runat="server">
                            </asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2">
                            &nbsp;
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2" align="center">
                            <asp:Button ID="btnAddCategories" Text="Add Category" runat="server" OnClick="btnAddCategories_Click" />
                            <asp:Button ID="btnEditCategory" runat="server" OnClick="btnEditCategory_Click" Text="Edit Category" />
                            <asp:Button ID="btnDeleteCategory" runat="server" OnClick="btnDeleteCategory_Click"
                                Text="Delete Category" />
                        </td>
                    </tr>
                </table>
                <table align="center">
                    <tr>
                        <td>
                            <asp:ListBox ID="lstCategory" runat="server"></asp:ListBox>
                        </td>
                    </tr>
                </table>
                <Triggers>
                <asp:AsyncPostBackTrigger ControlID="btnAddCategories" EventName="Click" />
                <asp:AsyncPostBackTrigger ControlID="btnEditCategory" EventName="Click" />
                <asp:AsyncPostBackTrigger ControlID="btnDeleteCategory" EventName="Click" />
            </Triggers>
            </ContentTemplate>
        </asp:UpdatePanel>
    </form>
</body>
</html>

Open in new window

KaranGuptaAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

David H.H.LeeCommented:
Hi KaranGupta,

Try turn off Update panel's ChildrenAsTriggers property for AsyncPostBackTrigger. It turn on by default for PostBackTrigger.
eg:
  <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers=false>

Check this for further details:
http://www.asp.net/ajax/documentation/live/mref/P_System_Web_UI_UpdatePanel_ChildrenAsTriggers.aspx
0
David RobitailleAnalyst ProgrammerCommented:
"But when I click on submit button, page still got submitted."
What do you meen, you got a screen flikker or the data is still got submited?
 
thing you could try is to remove the EventName="Click"
or
Buttons have a UseSubmitBehavior property that you could set to false.
http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.button.usesubmitbehavior.aspx
0
Kelvin McDanielSr. Developer/ConsultantCommented:
What are you actually expecting to update in the UpdatePanel?

If it isn't the entire table then you need to limit AN UpdatePanel to the CELLS of the table that you actually want updated. Unfortunately, if the UpdatePanel encloses a table then the entire table will be re-rendered on update.
0
Microsoft Azure 2017

Azure has a changed a lot since it was originally introduce by adding new services and features. Do you know everything you need to about Azure? This course will teach you about the Azure App Service, monitoring and application insights, DevOps, and Team Services.

KaranGuptaAuthor Commented:
Hi

By submitting means, page got submitted i.e. flickers.

Regards
Karan Gupta
0
KaranGuptaAuthor Commented:
Hi x_com

I have tried it but still I am getting the same problem.

Regards
Karan Gupta
0
David RobitailleAnalyst ProgrammerCommented:
i just saw it, put the trigger OUTSIDE the <ContentTemplate>

 

    </table>
</ContentTemplate>
 
                <Triggers>
                <asp:AsyncPostBackTrigger ControlID="btnAddCategories" EventName="Click" />
                <asp:AsyncPostBackTrigger ControlID="btnEditCategory" EventName="Click" />
                <asp:AsyncPostBackTrigger ControlID="btnDeleteCategory" EventName="Click" />
            </Triggers>
                    </asp:UpdatePanel>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Kelvin McDanielSr. Developer/ConsultantCommented:
Still going to have the issue of re-renderung the entire table, unless that's not a concern...
0
KaranGuptaAuthor Commented:
Hi

I have tried to bind it to one row only. Then also page flickers. Please see the code section.

Regards
Karan Gupta
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CategoryAdmin.aspx.cs" Inherits="Admin_CategoryAdmin" %>
 
<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
    Namespace="System.Web.UI" TagPrefix="asp" %>
<%--<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="AjaxToolKit" %>--%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Category Admin</title>
</head>
<body>
    <form id="frmCategoryAdmin" runat="server">
        <asp:ScriptManager EnablePartialRendering="true" ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <table align="center">
            <tr>
                <td align="center" colspan="2">
                    <asp:Label ID="lblHeading" runat="server" Text="Category"></asp:Label>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td colspan="2" align="center">
                    <asp:Label ID="lblMessage" runat="server"></asp:Label>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td>
                    <asp:Label ID="lblCategoryName" Text="Category Name" runat="server"></asp:Label>
                </td>
                <td>
                    <asp:TextBox ID="txtCategoryName" runat="server">
                    </asp:TextBox>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td colspan="2" align="center">
                    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
                        <ContentTemplate>
                            <asp:Button ID="btnAddCategories" UseSubmitBehavior="false" Text="Add Category" runat="server"
                                OnClick="btnAddCategories_Click" />
                            <asp:Button ID="btnEditCategory" UseSubmitBehavior="false" runat="server" OnClick="btnEditCategory_Click"
                                Text="Edit Category" />
                            <asp:Button ID="btnDeleteCategory" UseSubmitBehavior="false" runat="server" OnClick="btnDeleteCategory_Click"
                                Text="Delete Category" />
                            <triggers>
                <asp:AsyncPostBackTrigger ControlID="btnAddCategories" EventName="Click" />
                <asp:AsyncPostBackTrigger ControlID="btnEditCategory" EventName="Click" />
                <asp:AsyncPostBackTrigger ControlID="btnDeleteCategory" EventName="Click" />
            </triggers>
                        </ContentTemplate>
                    </asp:UpdatePanel>
                </td>
            </tr>
        </table>
        <table align="center">
            <tr>
                <td>
                    <asp:ListBox ID="lstCategory" runat="server"></asp:ListBox>
                </td>
            </tr>
        </table>
    </form>
</body>
</html>

Open in new window

0
David RobitailleAnalyst ProgrammerCommented:
again, you put the trigger INSIDE the <ContentTemplate>
put it outside and everything should be fine
0
Kelvin McDanielSr. Developer/ConsultantCommented:
As davrob60 said in #24475069, you need to move the <Triggers></Triggers> section outside of the <ContentTemplate></ContentTemplate> section.

Try this block (as provided, then updated)
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CategoryAdmin.aspx.cs" Inherits="Admin_CategoryAdmin" %>
 
<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
    Namespace="System.Web.UI" TagPrefix="asp" %>
<%--<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="AjaxToolKit" %>--%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Category Admin</title>
</head>
<body>
    <form id="frmCategoryAdmin" runat="server">
        <asp:ScriptManager EnablePartialRendering="true" ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <table align="center">
            <tr>
                <td align="center" colspan="2">
                    <asp:Label ID="lblHeading" runat="server" Text="Category"></asp:Label>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td colspan="2" align="center">
                    <asp:Label ID="lblMessage" runat="server"></asp:Label>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td>
                    <asp:Label ID="lblCategoryName" Text="Category Name" runat="server"></asp:Label>
                </td>
                <td>
                    <asp:TextBox ID="txtCategoryName" runat="server">
                    </asp:TextBox>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td colspan="2" align="center">
                    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
                        <ContentTemplate>
                            <asp:Button ID="btnAddCategories" UseSubmitBehavior="false" Text="Add Category" runat="server"
                                OnClick="btnAddCategories_Click" />
                            <asp:Button ID="btnEditCategory" UseSubmitBehavior="false" runat="server" OnClick="btnEditCategory_Click"
                                Text="Edit Category" />
                            <asp:Button ID="btnDeleteCategory" UseSubmitBehavior="false" runat="server" OnClick="btnDeleteCategory_Click"
                                Text="Delete Category" />
                            </ContentTemplate>
                            <Triggers>
                                <asp:AsyncPostBackTrigger ControlID="btnAddCategories" EventName="Click" />
                                <asp:AsyncPostBackTrigger ControlID="btnEditCategory" EventName="Click" />
                                <asp:AsyncPostBackTrigger ControlID="btnDeleteCategory" EventName="Click" />
                            </Triggers>
 
                    </asp:UpdatePanel>
                </td>
            </tr>
        </table>
        <table align="center">
            <tr>
                <td>
                    <asp:ListBox ID="lstCategory" runat="server"></asp:ListBox>
                </td>
            </tr>
        </table>
    </form>
</body>
</html>

Open in new window

0
KaranGuptaAuthor Commented:
Hi

I have put trigger outside the content template. And I have tried the code given to me by azarc3, but still I am facing same problem. Please look into the code.

Regards
Karan Gupta
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CategoryAdmin.aspx.cs" Inherits="Admin_CategoryAdmin" %>
 
<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
    Namespace="System.Web.UI" TagPrefix="asp" %>
<%--<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="AjaxToolKit" %>--%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Category Admin</title>
</head>
<body>
    <form id="frmCategoryAdmin" runat="server">
        <asp:ScriptManager EnablePartialRendering="true" ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <table align="center">
            <tr>
                <td align="center" colspan="2">
                    <asp:Label ID="lblHeading" runat="server" Text="Category"></asp:Label>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td colspan="2" align="center">
                    <asp:Label ID="lblMessage" runat="server"></asp:Label>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td>
                    <asp:Label ID="lblCategoryName" Text="Category Name" runat="server"></asp:Label>
                </td>
                <td>
                    <asp:TextBox ID="txtCategoryName" runat="server">
                    </asp:TextBox>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td colspan="2" align="center">
                    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="false">
                        <ContentTemplate>
                            <asp:Button ID="btnAddCategories" UseSubmitBehavior="false" Text="Add Category" runat="server"
                                OnClick="btnAddCategories_Click" />
                            <asp:Button ID="btnEditCategory" UseSubmitBehavior="false" runat="server" OnClick="btnEditCategory_Click"
                                Text="Edit Category" />
                            <asp:Button ID="btnDeleteCategory" UseSubmitBehavior="false" runat="server" OnClick="btnDeleteCategory_Click"
                                Text="Delete Category" />
                            </ContentTemplate>
                            <Triggers>
                                <asp:AsyncPostBackTrigger ControlID="btnAddCategories" EventName="Click" />
                                <asp:AsyncPostBackTrigger ControlID="btnEditCategory" EventName="Click" />
                                <asp:AsyncPostBackTrigger ControlID="btnDeleteCategory" EventName="Click" />
                            </Triggers>
 
                    </asp:UpdatePanel>
                </td>
            </tr>
        </table>
        <table align="center">
            <tr>
                <td>
                    <asp:ListBox ID="lstCategory" runat="server"></asp:ListBox>
                </td>
            </tr>
        </table>
    </form>
</body>
</html>

Open in new window

0
David RobitailleAnalyst ProgrammerCommented:
try this

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CategoryAdmin.aspx.cs" Inherits="Admin_CategoryAdmin" %>
 
<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
    Namespace="System.Web.UI" TagPrefix="asp" %>
<%--<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="AjaxToolKit" %>--%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Category Admin</title>
</head>
<body>
    <form id="frmCategoryAdmin" runat="server">
        <asp:ScriptManager EnablePartialRendering="true"  ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <table align="center">
                    <tr>
                        <td align="center" colspan="2">
                            <asp:Label ID="lblHeading" runat="server" Text="Category"></asp:Label>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2">
                            &nbsp;
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2" align="center">
                            <asp:Label ID="lblMessage" runat="server"></asp:Label>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2">
                            &nbsp;
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <asp:Label ID="lblCategoryName" Text="Category Name" runat="server"></asp:Label>
                        </td>
                        <td>
                            <asp:TextBox ID="txtCategoryName" runat="server">
                            </asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2">
                            &nbsp;
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2" align="center">
                            <asp:Button ID="btnAddCategories" Text="Add Category" runat="server" OnClick="btnAddCategories_Click" />
                            <asp:Button ID="btnEditCategory" runat="server" OnClick="btnEditCategory_Click" Text="Edit Category" />
                            <asp:Button ID="btnDeleteCategory" runat="server" OnClick="btnDeleteCategory_Click"
                                Text="Delete Category" />
                        </td>
                    </tr>
                </table>
                <table align="center">
                    <tr>
                        <td>
                            <asp:ListBox ID="lstCategory" runat="server"></asp:ListBox>
                        </td>
                    </tr>
                </table>
 
            </ContentTemplate>
                <Triggers>
                <asp:AsyncPostBackTrigger ControlID="btnAddCategories" EventName="Click" />
                <asp:AsyncPostBackTrigger ControlID="btnEditCategory" EventName="Click" />
                <asp:AsyncPostBackTrigger ControlID="btnDeleteCategory" EventName="Click" />
            </Triggers>
        </asp:UpdatePanel>
    </form>
</body>
</html>

Open in new window

0
KaranGuptaAuthor Commented:
Hi davrob60

I am facing same problem. Have you tried this code on your machine? Have you done any change in  code behind.

Regards
Karan Gupta
0
David RobitailleAnalyst ProgrammerCommented:
well updatepanels are pretty straightforward, i use them for a long time.

the only thing you could try is to remove the click event from the triggers:
</ContentTemplate>
                <Triggers>
                <asp:AsyncPostBackTrigger ControlID="btnAddCategories" />
                <asp:AsyncPostBackTrigger ControlID="btnEditCategory" />
                <asp:AsyncPostBackTrigger ControlID="btnDeleteCategory" />
            </Triggers>
        </asp:UpdatePanel>



By the way, you did not provide the code being, could you send the code of one of the buttons you "click" it it still don`t work. I will test it tomorrow, it`s 10pm here and i'm going to bed.
0
KaranGuptaAuthor Commented:
Hi

I tried to open the web page in internet explorer. I have seen the javascript error "Sys is undefined".
May be because of this reason page is flickering.

Is there anything I am missing in .aspx page?

Regards
Karan Gupta
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
.NET Programming

From novice to tech pro — start learning today.