devexpress控件之ASPxCallback

時間 2019-11-29

標籤 devexpress 控件 aspxcallback 简体版

原文原文鏈接

ASPxCallback主要是經過註冊客戶端事件與服務器端事件來相互通訊完成任務。
ASPxCallback控件爲咱們封裝了大量的Ajax操做，使用起來很是的方便，若是頁面中遇到須要局部刷的操做而又不想自動動手寫ajax的話，使用它就是很是不錯選擇。

客戶端向服務端發信息例如c1.PerformCallback('信息');

服務端向客戶端發信息先在後臺代碼中定義一個JSProperties屬性值

例如:ASPxComboBox2.JSProperties["cp_result"] = "abcd";

如何使用ASPXCallback:

1.向頁面添加ASPxCallBack組件，並設置ClientInstanceName屬性(客戶端標識,如 ClientInstanceName="Callback1")。

2•註冊ASPxCallBack組件的服務器端事件ASPxCallback_Callback,這個方法就是客戶端將要調用的服務器端的處理程序。

3•註冊ASPxCallBack組件的CallbackComplete事件，該事件指的是是當回完成後事件，可用來處理回調完以後的操做，並可經過參數e獲取parameter和設置返回的result的值。

4.在客戶端用ASPxCallBack組件的客戶端方法PerformCallback方法，以調用服務器端的ASPxCallback_Callback事件。
代碼：ASPxCallBack的客戶端標識ClientInstanceName.PerformCallback(要刷新的客戶端ID)
•CallBack組件自動調用CallbackComplete事件，完成這次操做。

一個簡單的例子

1.拖個ASPxButton控件，AutoPostBack="False" .

把DIV的ID設爲time

2.拖該控件，把它的客戶端標識屬性ClientInstanceName設爲c1

設置它的回傳CallBack事件中 e.Result = DateTime.Now.ToString();

3。設置它的客戶端事件CallbackComplete,意思：回傳完成後的操做

function(s, e) {
time.innerHTML =e.result;
}

4.自定義一個JS事件javascript

PerformCallback(局部刷新ID)意思：執行回傳 html

5.ASPxButton客戶端事件ajax

按鈕使用JS中定義的事件編程

<dx:ASPxButton ID="ASPxButton1" runat="server" AutoPostBack="False"
            Text="局部刷新" >
            <ClientSideEvents Click ="tt" />
        </dx:ASPxButton>

小結：c1.PerformCallback("test");意思：客戶端標識爲c1的ASPxCallback控件執行回傳，回傳客戶端ID爲test,這個須要JS。

它的客戶端事件CallbackComplete,

function(s, e) {
time.innerHTML =e.result;
}意思：回傳事件完成後的操做,這裏是把結果寫到time裏了

例子2.如今時間

</head>
<body>
    <form. id="form1" runat="server">
    <div id="t">
    </div>
    <div>
        <dx:ASPxCallback ID="ASPxCallback1" runat="server" ClientInstanceName="c1" nCallback="ASPxCallback1_Callback">
            <ClientSideEvents CallbackComplete="function(s, e) {
t.innerHTML=e.result;
}" />
        </dx:ASPxCallback>
    </div>
    </form>
</body>
</html>
C#

protected void ASPxCallback1_Callback(object source, DevExpress.Web.ASPxCallback.CallbackEventArgs e)
    {
        e.Result = DateTime.Now.ToString();
    }

下面這個例子將說明如何經過客戶端啓用服務器端的方法來更新DIV中的數據。

HTML代碼
三個DIV，每一個DIV分別有一個<a/>標籤，經過調用Javascript函數ShowDetails來更新DIV的內容，其中參數爲Div ID的最後一個數字。ASPxCallback組件同時註冊服務器的OnCallback事件，用來處理回調時處理，ClientSideEvents的 CallbackComplete方法當回調完成時將自動調用。
JS，經過Callback1.PerformCallback(id)調用服務器的OnCallback事件
[code]<script. type="text/javascript"></script>[/code]
[b]aspx:[/b]
[code]<div id="Detail1">
<a href="javascript.:ShowDetails('1');">Show Detail</a>
</div>
<div id="Detail2">
<a href="javascript.:ShowDetails('2');">Show Detail</a>
</div>
<div id="Detail3">
<a href="javascript.:ShowDetails('3');">Show Detail</a>
</div>

<dxcb:ASPxCallback ID="ASPxCallback1" runat="server" ClientInstanceName="Callback1"
nCallback="ASPxCallback1_Callback">
<ClientSideEvents CallbackComplete="function(s, e) {
var element = GetDetailsContainer(e.parameter);
element.innerHTML = e.result;
}" />
</dxcb:ASPxCallback>

[/code]C#，在OnCallback事件中接受客戶端傳遞過來的參數，以進行判斷是更新的哪個DIV，並經過e.Result返回處理後的結果：[code]protected void ASPxCallback1_Callback(object source, CallbackEventArgs e) { switch (e.Parameter) { case "1": e.Result = "WCF分佈式開發步步爲贏(1)：WCF分佈式框架基礎概念"; break; case "2": e.Result = "WCF分佈式開發步步爲贏(2)自定義託管宿主WCF解決方案開發配置過程詳解"; break; case "3": e.Result = "WCF分佈式開發步步爲贏(3)WCF服務元數據交換、配置及編程開發"; break; } }[/code]最後，Aspx系列控件的全部的客戶端回調都是經過這種模塊完成的，如設置Aspx的ClientInstanceName屬性，添加註冊Aspx服務器端的Callback方法，在客戶端調用Aspx的PerformCallback()方法等。這種模式在之後的使用過程當中會常常的見到。 function forumhottag_callback(data){ tags = data; }</SCRIPT. type="text/javascript." </SCRIPT. type="text/javascript." parsetag();</SCRIPT.

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。