ASPxCallbackPanel的使用

最新推荐文章于 2019-01-17 17:36:00 发布

wServices

最新推荐文章于 2019-01-17 17:36:00 发布

阅读量7.7k

点赞数

CC 4.0 BY-SA版权

分类专栏：读书笔记文章标签： callback server function asp 服务器 table

本文链接：https://blog.youkuaiyun.com/wservices/article/details/4280617

读书笔记专栏收录该内容

5 篇文章

订阅专栏

本文介绍如何使用ASPxCallbackPanel实现局部异步刷新，通过ListBox选择不同内容展示，结合MultiView控件完成视图切换。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1 ASPxCallbackPanel的使用

AspxCallbackPanel主要作用是对本身内部进行异步刷新，实现此种效果的方法有很多，个人认为最简单的方式
就是利用 AJAX控件中的UpdatePanel，比这种方式更为方便和好用。

下面这个例子就是通过一个ListBox，从客户端回调AspxCallbackPanel，从而更新AspxCallbackPanel内的MultiView控件显示
信息。

首选，先在页面中放置一个AspxCallbackPanel控件，并设置ClientInstanceName属性为“CallbackPanel”,其作用就是通过客户
端的javascript脚本引用ASPxCallbackPanel控件。

<dxcp:ASPxCallbackPanel ID="ASPxCallbackPanel" runat="server" ClientInstanceName="CallbackPanel" OnCallback="ASPxCallbackPanel_Callback" Width="100%"> </dxcp:ASPxCallbackPanel>

接下来再放置一个MultiView控件，设置多个View，让他显示不同的内容,注意，MultiView是放置在ASPCallbackPane的<PanelCollection>中。如下

<dxcp:ASPxCallbackPanel ID="ASPxCallbackPanel" runat="server" ClientInstanceName="CallbackPanel" OnCallback="ASPxCallbackPanel_Callback" Width="100%"> <PanelCollection> <dxp:PanelContent ID="PanelContent1" runat="server"> <asp:MultiView ID="MultiView" runat="server"> <asp:View ID="View1" runat="server"> <table> <tr> <td valign="top"> <dxe:ASPxLabel ID="ASPxLabel1" runat="server" Text="♣我是谁？不要告诉我是上班族，现在的上班族太民工；不要告诉我是民工，现在民工太缺钱；不要告诉我是富翁，富翁大都是暴发户；不要告诉我是暴发户，暴发户都想当明星；不要告诉我是明星，现在明星就像上班族。" Font-Bold="True"> </dxe:ASPxLabel> </td> </tr> </table> </asp:View> <asp:View ID="View2" runat="server"> <table> <tr> <td valign="top"> <dxe:ASPxLabel ID="ASPxLabel3" runat="server" Text="♣许多人不知道自己失去过什么，而时间总是耐心地给出答案。看着过去失去的东西，会有一种心痛的感觉！算是一种悔悟吧！" Font-Bold="True"> </dxe:ASPxLabel> </td> </tr> </table> </asp:View> <asp:View ID="View3" runat="server"> <table> <tr> <td valign="top"> <dxe:ASPxLabel ID="ASPxLabel5" runat="server" Text="♣一个人吻你，你一定被人深爱；不少人吻你，你一定是个漂亮的小孩；非常多的人吻你，你会被口水淹死" Font-Bold="True"> </dxe:ASPxLabel> </td> </tr> </table> </asp:View> </asp:MultiView></dxp:PanelContent> </PanelCollection> </dxcp:ASPxCallbackPanel>

然后，在页面中添另一个ListBox，用来控制显示NulitView中的哪一个View,如下：

dxe:ASPxListBox ID="ASPxListBox1" runat="server" ClientInstanceName="ListBox" Height="83px"> <Items> <dxe:ListEditItem Text="雷语1" Value="0" /> <dxe:ListEditItem Text="雷语2" Value="1" /> <dxe:ListEditItem Text="雷语3" Value="2" /> </Items> <ClientSideEvents SelectedIndexChanged="function(s, e) { var item = ListBox.GetSelectedItem(); CallbackPanel.PerformCallback(item.value);  }" Init="function(s, e) { ListBox.SetSelectedIndex(0); CallbackPanel.PerformCallback(0); }" /> </dxe:ASPxListBox>

最后是服务器代码：

protected void ASPxCallbackPanel_Callback(object source, CallbackEventArgsBase e) { MultiView.ActiveViewIndex = Convert.ToInt32(e.Parameter); }

当客户端触发ListBox的SelectedIndexChanged事件时，就会执行在ListBox客户端注册的如下代码
SelectedIndexChanged="function(s, e) {

var item = ListBox.GetSelectedItem();

CallbackPanel.PerformCallback(item.value); //此行执行ASPxCallbackPanel的回调，即服务器事件ASPxCallbackPanel_Callback。

说明：AspxCallbackPanel的PerformCallback的方法原型：

function PerformCallback(

parameter : String

) : Void;

其中传递的参数可通过AspxCallbackPanel的Callback事件中的 CallbackEventArgsBase得到，如服务器端代码。
PerformCallback的回调还可用于ASPxDataView 等控件，使用方法均相同。