AjaxManager（客户端API）

1.公共API

1）ajaxRequest（参数）

要触发对服务器的回发或 AJAX 请求，请使用该ajaxRequest(arguments)函数启动通用 AJAX 请求。事件目标默认为RadAjaxPanel 或者 RadAjaxManager实例。这些arguments是控件在提出请求时使用的参数。

2）AJAX请求

当在ajaxRequest客户端调用该函数时，AjaxRequest可以在服务器上的事件处理程序中处理它

 如何在客户端执行 AJAX 请求并在服务器上处理它。

//.net
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
    <script type="text/javascript">

        function InitiateAjaxRequest(arguments) {
            var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");
            ajaxManager.ajaxRequest(arguments);
        }
    </script>
</telerik:RadCodeBlock>

//c#
private void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
{
    //处理通用AJAX请求的代码
}  

如何将 AjaxManager 设置为更新 TextBox 控件的 AJAX 启动器。

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
</telerik:RadScriptManager>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="TextBox1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>

两种按钮事件：

//方案一
<%-- 系统按钮，名为AjaxButton，在客户端执行 AJAX 请求并在服务器上处理它 --%>
<input type="button" onclick="AjaxRequestButton(); return false;" 
    value="AjaxButton" />
<telerik:RadCodeBlock ID="cb1" runat="server">
    <script type="text/javascript">
        /*ajaxRequest(arguments)函数启动通用AJAX请求*/
        function AjaxRequestButton(arguments) {
            var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");
            ajaxManager.ajaxRequestWithTarget('<%= Button1.UniqueID %>', '');
        }
    </script>
</telerik:RadCodeBlock>

//方案二
//.net
<%-- 如何将 AjaxManager 设置为更新 TextBox 控件的 AJAX 启动器 --%>      
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click"></asp:Button>
<asp:TextBox ID="TextBox1" runat="server" Text=""></asp:TextBox>
<asp:ScriptManager ID="ScriptManager" runat="server" />
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="Button1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="TextBox1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>

//c#
 //按钮事件，响应按钮请求
        protected void Button1_Click(object sender, EventArgs e)
        {
            TextBox1.Text = DateTime.Now.ToLongTimeString();
        }

2.RadAjaxManager 对象

如何使用get_ajaxSettings配置

<script type="text/javascript">
    function myFunction() {
        var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");
        var settings = ajaxManager.get_ajaxSettings();
        var settingsList = '';

        for (setting in settings) {
            var initiatingControl = settings[setting].InitControlID;
            var controls = settings[setting].UpdatedControls;
            var controlList = '';

            for (control in controls) {
                controlList += ' ' + controls[control].ControlID;
            }
            settingsList += '\nInitiated by: ' + initiatingControl + '\nUpdated Controls: ' + controlList;
        }
        alert(settingsList);
    }
</script>

3.活动

1）客户端事件概述

AjaxManager 和 AjaxPanel 都来自RadAjaxControl实例。

RadAjaxControl引入了AjaxClientEvents包含以下事件的属性：
       OnRequestStart----- 启动对服务器的请求时触发。
       OnResponseEnd-----在处理来自服务器的响应时触发。

如何在请求开始和结束时显示消息。

<script type="text/javascript">
    function requestStart(sender, eventArgs) {
        alert('Request start');
    }
    function responseEnd(sender, eventArgs) {
        alert('Response complete');
    }
</script>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    <ClientEvents OnRequestStart="requestStart" OnResponseEnd="responseEnd" />
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="Button1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="TextBox1"></telerik:AjaxUpdatedControl>
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>

2）OnRequestStart

当OnRequestStart启动对服务器的请求时，将调用客户端事件处理程序。

使用以下方法将两个参数传递给事件处理程序：

• sender— 客户端RadAjaxManager或RadAjaxPanel对象的实例。

• eventArgs——提供以下方法：

  • set_cancel()— 允许或阻止 AJAX 请求继续。调用set_cancel(true)会阻止请求继续。

  • get_eventTarget()— 获取UniqueID已提出请求的元素。

  • get_eventArgument()— 获取初始 AJAX 请求中传递的字符串。

  • get_eventTargetElement()— 获取引发 AJAX 请求的客户端对象的实例。您可以迭代每个设置并检索启动控件id和另一个表示更新控件的对象数组。

  • get_ajaxSettings()— 返回一个对象数组，这些对象表示 AjaxManager 当前的 AjaxManager 配置或 AjaxPanel 的更新控件。

  • get_enableAjax(), set_enableAjax()— 获取或设置是否执行 AJAX 请求。set_enableAjax(false)导致使用标准回发执行请求。

发起请求的控件：

<script type="text/javascript">
    function requestStart(sender, eventArgs) {
        alert('Request start initiated by: ' + eventArgs.get_eventTarget());
    }
</script>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    <ClientEvents OnRequestStart="requestStart" />
</telerik:RadAjaxManager>

3） OnResponseEnd

当OnResponseEnd从服务器接收到请求时调用客户端事件处理程序。活动不能取消。

使用以下方法将两个参数传递给事件处理程序：

• sender—客户端RadAjaxManager/RadAjaxPanel对象的实例。

• eventArgs——提供以下方法：

  • get_eventTarget()— 获取UniqueID已提出请求的元素。

  • get_eventArgument()— 获取初始 AJAX 请求中传递的字符串。

  • get_eventTargetElement()— 获取引发 AJAX 请求的客户端对象的实例。

发起请求的控件:

<script type="text/javascript">
    function responseEnd(sender, eventArgs) {
        alert('Response end initiated by: ' + eventArgs.get_eventTarget());
    }
</script>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    <ClientEvents OnResponseEnd="responseEnd" />
</telerik:RadAjaxManager>