AJAX UpdatePanel still posts back entire page!

I am trying an AJAX example that I got online and everytime i click the button, it is suppose to only update the one label, but instead it does a postback of the entire page (i can see the page flicker as it reloads) and it changes the value of both labels. Can anyone tell me how to get only the label in the updatepanel to update instead of the entire page posting back? I am running Visual Studio 2008 which does have the AJAX controls installed on a Vista machine.

Here is my codebehind file
Partial Class _Default
    Inherits System.Web.UI.Page


    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        lblFirstLoad.Text = DateTime.Now.ToString()
    End Sub


    Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs)
        lblLastUpdated.Text = DateTime.Now.ToString()

    End Sub
End Class

AND BELOW IS MY PAGE DEFAULT.aspx
<%@ Page Language="VB" CodeFile="Default.aspx.vb" Inherits="_Default" %>
 
<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
    Namespace="System.Web.UI" TagPrefix="asp" %>
 
<!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>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Label ID="lblNewTickets" runat="server" Text="New Tickets"></asp:Label>
        <asp:Label ID="lblFirstLoad" runat="server" Text="Label"></asp:Label>
        
        
        <asp:ScriptManager ID="smNewTickets" runat="server">
        </asp:ScriptManager>
        
        <asp:UpdatePanel ID="upNewTickets" runat="server">
           <ContentTemplate>
 
               <asp:Label ID="lblLastUpdated" runat="server"></asp:Label>
               <asp:Button ID="Button1" runat="server" Text="Get Tickets" OnClick="Button1_Click" />
 
           </ContentTemplate>
 
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
            </Triggers>
 
        </asp:UpdatePanel>
        
      
        
    </div>
 
    </form>
</body>
</html>

Open in new window

LVL 5
twcadminAsked:
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 RobitailleAnalyst ProgrammerCommented:
Page_Load is run at each pust back,  Async or not
this should help

 Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
      If Not (Page.IsPostBack) Then
        lblFirstLoad.Text = DateTime.Now.ToString()
      end if
    End Sub

Open in new window

0
David RobitailleAnalyst ProgrammerCommented:

It will change nothing, but it s how i define a UpdatePanel.
UpdateMode="Conditional" is important if you want to set triggers and i usualy dont set event for a button trigger.
but i m pretty sure the problem was the page_load
 

<asp:UpdatePanel ID="upNewTickets" runat="server"
          UpdateMode="Conditional" ChildrenAsTriggers="False" >
           <ContentTemplate>
 
               <asp:Label ID="lblLastUpdated" runat="server"></asp:Label>
               <asp:Button ID="Button1" runat="server" Text="Get Tickets" OnClick="Button1_Click" />
 
           </ContentTemplate>
 
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="Button1" />
            </Triggers>
 
        </asp:UpdatePanel>

Open in new window

0
twcadminAuthor Commented:
But the entire page still posts back! whats the point of an updatepanel then?


I am trying to get  one section of data to update without the whole page flickering. This makes no sense!
0
Introducing Cloud Class® training courses

Tech changes fast. You can learn faster. That’s why we’re bringing professional training courses to Experts Exchange. With a subscription, you can access all the Cloud Class® courses to expand your education, prep for certifications, and get top-notch instructions.

David RobitailleAnalyst ProgrammerCommented:
No, the whole page is not posting back.
The problem is the page is loading at each post back, that s why you should add a "If Not (Page.IsPostBack) Then" in the page load event.
In your case, the  "lblFirstLoad.Text = DateTime.Now.ToString()" line that trigger a full post back after the async post back.


0
David RobitailleAnalyst ProgrammerCommented:
So, did that work?
0
twcadminAuthor Commented:
so then how do i get only the one section to update instead of having the whole page load again? I want to eliminate the flicker of the page loading again like i see with so many other ajax enabled sites.

Otherwise, I could just take out the updatepanel completely and use the if not postback becuase the updatepanel would be useless
0
David RobitailleAnalyst ProgrammerCommented:
Has i said: ADD the " If Not (Page.IsPostBack) Then" in your page load.
Just test it, you will see that work, you wont get any flicker.
i will send you some justification link later.
 

 

      If Not (Page.IsPostBack) Then
        lblFirstLoad.Text = DateTime.Now.ToString()
      end if

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
twcadminAuthor Commented:
Thank you very much! When you first said to use if not ispostback i tried it and for some reason it was still flickering and loading the entire page. Now it works. Thanks again!
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
AJAX

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.