RadAjax for ASP.NET
Contents
Manually add an AJAX request to a client-side event of an HTML element Send comments on this topic.
How-to > Manually add an AJAX request to a client-side event of an HTML element

Glossary Item Box

Usually the HTML elements have more client-side events than their server-side counterparts. For example the asp:TextBox control implements only the TextChanged server-side event while the corresponding HTML element has a few more ?? OnMouseOver, OnMouseOut, OnKeyPress, OnKeyUp, OnKeyDown, etc. If you want to ajaxify one of these client events you have to follow the instructions bellow:

Method I (add the attribute declaratively)

  1. Add the OnKeyUp attribute and make it call a custom function:
    ASPX Copy Code
    <asp:TextBox onkeyup="TextBoxCustomAjax('TextBox1');" ID="TextBox1" runat="server" ></asp:TextBox>
     
  2. Implement the TextBoxCustomAjax function:
    JavaScript Copy Code
    <script type="text/javascript">
      function TextBoxCustomAjax(eventArgs)
                {
                    <%=RadAjaxManager1.ClientID %>.AjaxRequest(eventArgs);
                }
    </script>
     
  3. Implement the AjaxRequest server event of the AjaxManager:
    C# Copy Code
    protected void RadAjaxManager1_AjaxRequest( object sender, Telerik.WebControls.AjaxRequestEventArgs e)
    {
                if (e.Argument == TextBox1.ClientID)
           {
               Label1.Text = TextBox1.Text;
           }
    }
  4. Set from the designer that the RadAjaxManager1 will update Label1.

 

Method II (add the attribute from code-behind).

  1. Add the OnKeyUp attribute:
    C# Copy Code
    protected void Page_Load(object sender, EventArgs e)
        {
           TextBox1.Attributes.Add(     "onkeyup", RadAjaxManager1.GetAjaxRequestReference(TextBox1.ClientID));
        }
     
  2. Implement the AjaxRequest event of the RadAjaxManager:
    C# Copy Code
    protected void RadAjaxManager1_AjaxRequest(object sender, Telerik.WebControls.AjaxRequestEventArgs e)
    {
                if (e.Argument == TextBox1.ClientID)
           {
               Label1.Text = TextBox1.Text;
           }
    }
     
  3. Set from the design-time configuration wizard that RadAjaxManager1 will update Label1.