Ajax cannot update the result of Label

2 posts, 0 answers
  1. wu
    wu avatar
    1 posts
    Member since:
    Oct 2010

    Posted 23 Oct 2010 Link to this post

    i read http://www.telerik.com/help/aspnet-ajax/ajxaddajaxrequesttoclientevent.html and made a similar demo, when client-side call
    the TextBoxCustomAjax function to use Ajax send the request to server, server-side event RadAjaxManager1_AjaxRequest can be fired, and Label1.Text also updated value, but client-side cannot see any the updated result, why? i'm using RadControls 2010 for Ajax asp.net and VS 2010, these are my full demo code:
    ///////////////////////////////////////////////////////////////////////////////AddAjaxToHtmlElement.aspx///////////////////////////////////////////////////
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AddAjaxToHtmlElement.aspx.cs" Inherits="AddAjaxToHtmlElement"  %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" />
    </head>
    <body>
        <form id="form1" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
            <Scripts>
                <%--Needed for JavaScript IntelliSense in VS2010--%>
                <%--For VS2008 replace RadScriptManager with ScriptManager--%>
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
            </Scripts>
        </telerik:RadScriptManager>
        <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
            //Put your JavaScript code here.
            function TextBoxCustomAjax(eventArgs) {
                $find("<%=RadAjaxManager1.ClientID %>").ajaxRequest(eventArgs);
            }
        </script>
        </telerik:RadCodeBlock>
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" >

        </telerik:RadAjaxManager>
        <div>
            <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" Height="200px" Width="300px">
                 <asp:Label ID="Label1" runat="server" Text="Label1" /><br />
                 <asp:TextBox ID="TextBox1" runat="server"
                     onkeyup="TextBoxCustomAjax('TextBox1');" type="text" /> <br />
            </telerik:RadAjaxPanel>

        </div>
        </form>
    </body>
    </html>
    ///////////////////////////////////////////////////////////////////////////////////////////////////////AddAjaxToHtmlElement.aspx.cs/////////////////////////////////////////////////////////
    using System;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;

    using System.Data;
    using System.Configuration;
    using System.Web.Security;
    using System.Web.UI.WebControls.WebParts;
    using System.Web.UI.HtmlControls;
    using Telerik.Web.UI;

    public partial class AddAjaxToHtmlElement : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            RadAjaxManager1.AjaxRequest += RadAjaxManager1_AjaxRequest;
        }
        protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
        {
            if (e.Argument == TextBox1.ClientID)
            {
                Label1.Text = TextBox1.Text;
                Page.Title = TextBox1.Text;
            }
        }
    }
    /*
      note :
                Label1.Text = TextBox1.Text;
                Page.Title = TextBox1.Text;
        Page.Title can be updated, but Label1.Text cannot be updated!!!
        why??
    */
  2. Pavel
    Admin
    Pavel avatar
    904 posts

    Posted 26 Oct 2010 Link to this post

    Hello Wu,

    Since you are using RadAjaxManager's ajaxRequest() client-side method to initiate the ajax, you need to add settings for it to update the Label:
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" >
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="Label1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
    Note that it is not recommended to use both RadAjaxPanel and RadAjaxManager to ajaxify the same controls so you can remove the panel from your markup.

    I also recommend you to read the following help article:
    http://www.telerik.com/help/aspnet-ajax/ajxclientsideapi.html

    Kind regards,
    Pavel
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Back to Top