產品版本：RadControls for ASP.NET Ajax Q1 2009

Telerik 的控件實現 Ajax 的方式比 asp.net ajax 要簡單些。有如下特點：

1. 不需要拖放很多 Update Panel,triggers.

只要在現有 webform 的底部加一個 RadAjaxManager,然后點 "Configure Ajax Manager",在其中配置更新關系即可。其中可以配置多個更新的設置，每一個設置是如下結構：

發起控件(一個)—— 被更新的控件(多個)

2. 配置 ajax callback 的方式很簡單，容易理清頁面上控件的觸發-更新關系。

如1所說，生成的控件代碼如下：

telerik:RadAjaxManager@H_301_16@

ID@H_301_16@

="RadAjaxManager1"@H_301_16@

runat@H_301_16@

="server"@H_301_16@

>@H_301_16@

@H_301_16@

AjaxSettings@H_301_16@

telerik:AjaxSetting@H_301_16@

AjaxControlID@H_301_16@

="Button1"@H_301_16@

UpdatedControls@H_301_16@

telerik:AjaxUpdatedControl@H_301_16@

ControlID@H_301_16@

="Label1"@H_301_16@

@H_301_16@

/>@H_301_16@

@H_301_16@

telerik:AjaxSetting@H_301_16@

telerik:RadAjaxManager@H_301_16@

>@H_301_16@

當然，要記得在頁面首部放一個

和 asp.net ajax 類似的，它也有一個 RadAjaxManagerProxy 控件，用于在 User Control 或Content Page (master page 的使用場景)中使用。

RadAjax 的實現原理是通過將 PostBack 截獲，轉換為 ajaxcallback 來實現，在得到結果后，僅更新在上述配置中需要更新的那些目標控件。

因此對于一些默認不自動 PostBack 的控件，如果要讓其能夠觸發 ajax callback,必須設置 AutoPostBack="True"，才能作為觸發控件使用。比如 CheckBox,TextBox 等。

常用的調試手段：如果 ajax callback 出錯，首先想到的是將這個觸發控件的 EnableAjax 屬性設為 false,這樣就恢復了一般的 PostBack 模式，可以查看到詳細的錯誤信息。

另外還有兩個 ajax 相關的控件：

1. RadAjaxPanel: 這個是 asp.net ajax UpdatePanel 控件的代替品，自動捕獲其中的 PostBack 并轉化為 ajax callback.

2. RadAjaxLoadingPanel: 用來顯示一些 loading 的等待信息。

在服務器端添加控件更新設置：

RadAjaxManager1.AjaxSettings.AddAjaxSetting(,);

RadAjaxManager1.AjaxSettings.AddAjaxSetting(,, or null if none);

注意：此方法可以在 Page_Load 或 Page_PreRender 中調用。不能在 Page_Init 中調用，因為此時 AjaxManager 還沒被創建。

客戶端用 js 代碼控制 RadAjaxManager 更新：

$find("").ajaxRequest(arguments);

該函數在服務器端會觸發 AjaxRequest 事件，可以通過訂閱該事件來處理請求。

ajaxRequestWithTarget(eventTarget,eventArguments) 函數可用來模擬其他控件發送 PostBack 或 ajax callback.

__doPostBack(eventTarget,eventArguments)

或

$find("").ajaxRequestWithTarget(eventTarget,eventArguments);

該函數在服務器端可通過對應的 event handler 來處理，如 Button1_Click.

在 UserControl 中，應該使用 RadAjaxManagerProxy 而不是 RadAjaxManager 控件。

但如果需要獲得當前頁面所包含的 RadAjaxManager,則也可以用 RadAjaxManager.GetCurrent() 來取得。如果不存在則返回 null.

RadAjaxManager.GetCurrent(Page);

例子：

telerik:RadCodeBlock@H_301_16@

="RadCodeBlock1"@H_301_16@

script@H_301_16@

type@H_301_16@

="text/javascript"@H_301_16@

@H_301_16@

function@H_301_16@

myUserControlClickHandler()

{

$find(@H_301_16@

"@H_301_16@

@H_301_16@

).ajaxRequest(@H_301_16@

content@H_301_16@

);

}

@H_301_16@

script@H_301_16@

telerik:RadCodeBlock@H_301_16@

復雜些的應用場景：

GridView 中的某些按鈕要求能觸發 ajax callback,而另一些則保持原有的 PostBack 行為。

解決辦法：

在 GridView 的RowCreated 事件中，處理 DataRow 的 PreRender 事件，在 PreRender 事件處理函數中找到需要觸發 ajax callback 的按鈕，用 RadAjaxManager.AddAjaxSetting() 方法動態注冊之。

注意：不要混用 RadAjaxPanel 和 RadAjaxManager. 如果一個控件被包含在 RadAjaxPanel 中，同時又是 RadAjaxManager 里注冊的一個觸發控件，則 Manager 中的設置不會起作用。

Q: 設置要被更新的控件被換行顯示了？

A: RadAjaxManager 對設置的更新目標控件自動添加 UpdatePanel,而該 panel 的默認布局方式是 block. 可以設置成 inline 來阻止其換行，破壞布局。代碼如下：

="server"@H_301_16@

UpdatePanelsRenderMode="Inline"@H_301_16@@H_301_16@@H_301_16@

="RadGrid1"@H_301_16@

="RadGrid1"@H_301_16@

="Label2"@H_301_16@

RadAjaxPanel 的目的是為了更新其中的內容，如果要觸發其外部某些控件的更新，一般最好用 RadAjaxManager 來實現。但不用 RadAjaxManager 也是可以的。辦法是通過 ResponseScripts 方法添加客戶端的腳本去觸發其他控件的更新。例子如下：

ASPX:

asp:ScriptManager@H_301_16@

="ScriptManager"@H_301_16@

h3@H_301_16@

Panel1@H_301_16@

telerik:RadAjaxPanel@H_301_16@

="RadAjaxPanel1"@H_301_16@

asp:Button@H_301_16@

="btnIncrease"@H_301_16@

OnClick@H_301_16@

="btnIncrease_Click"@H_301_16@

Text@H_301_16@

="Increase"@H_301_16@

asp:Button@H_301_16@

asp:Label@H_301_16@

0@H_301_16@

asp:Label@H_301_16@

asp:TextBox@H_301_16@

="TextBox1"@H_301_16@

="0"@H_301_16@

>@H_301_16@

asp:TextBox@H_301_16@

telerik:RadAjaxPanel@H_301_16@

Panel2@H_301_16@

="RadAjaxPanel2"@H_301_16@

="btnDecrease"@H_301_16@

="btnDecrease_Click"@H_301_16@

="Decrease"@H_301_16@

="TextBox2"@H_301_16@

Code behind:

protected@H_301_16@

void@H_301_16@

Page_PreRender(@H_301_16@

object@H_301_16@

sender,EventArgse)

{

@H_301_16@

if@H_301_16@

(RadAjaxPanel1.IsAjaxRequest@H_301_16@

||@H_301_16@

RadAjaxPanel2.IsAjaxRequest)

{

TextBox1.Text@H_301_16@

=@H_301_16@

Label1.Text@H_301_16@

TextBox2.Text@H_301_16@

Label2.Text@H_301_16@

Count.ToString();

}

}

@H_301_16@

public@H_301_16@

int@H_301_16@

Count

{

@H_301_16@

get@H_301_16@

{

@H_301_16@

return@H_301_16@

this@H_301_16@

.ViewState[@H_301_16@

"@H_301_16@

Count@H_301_16@

"@H_301_16@

]@H_301_16@

==@H_301_16@

null@H_301_16@

?@H_301_16@

@H_301_16@

0@H_301_16@

:(@H_301_16@

)@H_301_16@

];

}

@H_301_16@

set@H_301_16@

value;

}

}

@H_301_16@

btnIncrease_Click(@H_301_16@

301_16@

++@H_301_16@

;

RadAjaxPanel1.ResponseScripts.Add(String.Format(@H_301_16@

$find('{0}').ajaxRequest();@H_301_16@

,RadAjaxPanel2.ClientID));

}

@H_301_16@

btnDecrease_Click(@H_301_16@

--@H_301_16@

;

RadAjaxPanel2.ResponseScripts.Add(String.Format(@H_301_16@

301_16@

在 UserControl / Content page 里處理主頁面的 RadAjaxManager 的事件(客戶端事件、服務端事件都能訂閱)的例子：

Page_Load(@H_301_16@

301_16@

RadAjaxManager.GetCurrent(Page);

manager.ClientEvents.OnRequestStart@H_301_16@

onRequestStart@H_301_16@

;

manager.ClientEvents.OnResponseEnd@H_301_16@

onResponseEnd@H_301_16@

;

manager.AjaxRequest@H_301_16@

+=@H_301_16@

new@H_301_16@

RadAjaxControl.AjaxRequestDelegate(manager_AjaxRequest);

}

@H_301_16@

manager_AjaxRequest(@H_301_16@

301_16@

//@H_301_16@

handlethemanagerAjaxRequesteventhere@H_301_16@

}@H_301_16@

總結

如果覺得編程之家網站內容還不錯，歡迎將編程之家網站推薦給程序員好友。

本圖文內容來源于網友網絡收集整理提供，作為學習參考使用，版權屬于原作者。

總結

以上是生活随笔為你收集整理的telerik grid ajax,Telerik ajax 控件学习笔记 - Ajax的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。