Unable to Update label Outside Update Panel

Question

I have spent lot of time to investigate how to update label outside Update panel. And finally found something but it does not update label. It works fine if we refresh the p

Answer 1

If you need to update the label with dynamic content from the server, have it wrapped in the same updatepanel or another updatepanel.

If the Label text is not dynamic, you could probably use JS to alter the label before firing the right event.

Also, UpdatePanels do "cause postbacks". its just that you don't notice them.

Or you can do this way:

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

<asp:UpdatePanel ID="UpdatePanel2" runat="server">
            <ContentTemplate>
                <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
            </ContentTemplate>
</asp:UpdatePanel>

Code-behind:

protected void Button1_Click(object sender, EventArgs e)
{
   Label1.Text = "Updated";
}

Answer 2

You need to use the pageLoaded event of the PageRequestManager.

The pageLoading event is raised before any content on the page is updated. So your changes made in pageLoading event will be lost if you also make changes to label's content anywhere else.

Therefore, when using the pageLoaded event which is raised after all content on the page is refreshed as a result of either a synchronous or an asynchronous postback, chnages made inside this event will overwrite all changes made anywhere else and will be the final.

<script type="text/javascript" language="javascript">

        Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(PageLoadedHandler)

        function PageLoadedHandler(sender, args) {

            var dataItems = args.get_dataItems();
            if ($get('Label3') != null)
               // set Label3 to your actual values. You can test/debug by adding
               // any test value
                $get('Label3').innerHTML = "TTTTestingggg";


        }

    </script>

Answer 3

Add the register script in code behind event,

protected void timer_Tick(object sender, EventArgs e)
{
   if (ScriptManager1.IsInAsyncPostBack)
    {
      //ScriptManager1.RegisterDataItem(Label3, "Hi");
       ScriptManager.RegisterStartupScript(this, this.GetType(), "setLabelOrAnyName", "jQuery(function($) { $('#Label3').text('Whatever')});", true);
    }
 }

This should work.

Incase if you are not using jQuery library replace code with simple javascript.