Ext.Net通过DirectEvents进行服务器端异步的事件处理。【Ext.Net学习笔记】02：Ext.Net用法概览、Ext.Net MessageBus用法、Ext.Net布局 中已经简单的介绍了DirectEvents，今天将详细的介绍一下DirectEvents。

DirectEvents异步执行服务器端事件

我们首先来看一下Ext.Net DirectEvents的一个最简单用法，通过点击按钮触发服务器端的事件处理方法，并在前台弹出一个提示框。

<ext:Window runat="server" ID="win1"Title="Ext.Net DirectEvents"Width="300" Height="200"><Buttons><ext:Button runat="server" ID="btnOK"Text="确定" Icon="Accept"OnDirectClick="btnOK_DirectClick"></ext:Button></Buttons>
</ext:Window>

这里添加了OnDirectEvents事件，它的一个简写方式，完整的写法如下：

<ext:Button runat="server" ID="btnOK"Text="确定" Icon="Accept"><DirectEvents><Click OnEvent="btnOK_DirectClick"></Click></DirectEvents>
</ext:Button>

事件处理方法如下：

protected void btnOK_DirectClick(object sender, Ext.Net.DirectEventArgs e)
{X.MessageBox.Alert("提示", "按钮被点击").Show();
}

编译代码并刷新页面，点击按钮，我们会看到如下效果：

显示Mask遮罩层

上面的代码已经演示了如何使用DirectEvents执行服务器端的事件，DirectEvents是通过异步方式执行服务器端代码的，那么，我们通常会希望在执行的时候客户端显示一个遮罩层，阻止用户进行其他操作，这点Ext.Net已经为我们想到了。

<ext:Button runat="server" ID="btnOK"Text="确定" Icon="Accept"><DirectEvents><Click OnEvent="btnOK_DirectClick"> <EventMask ShowMask="true" Msg="正在处理..."></EventMask></Click></DirectEvents>
</ext:Button>

然后我们在服务器端事件处理方法中让程序休息一下：

        protected void btnOK_DirectClick(object sender, Ext.Net.DirectEventArgs e){System.Threading.Thread.Sleep(3000);//将当期线程挂起3000毫秒，即3秒X.MessageBox.Alert("提示", "按钮被点击").Show();}

这样当我们再点击按钮的时候，会看到如下效果：

为事件添加自定义参数

Ext.Net DirectEvents 还允许我们为事件添加自定义参数。

<ext:Button runat="server" ID="btnOK"Text="确定" Icon="Accept"><DirectEvents><Click OnEvent="btnOK_DirectClick"><EventMask ShowMask="true" Msg="正在处理..."></EventMask> <ExtraParams><ext:Parameter Name="name" Value="btnOK"></ext:Parameter></ExtraParams></Click></DirectEvents>
</ext:Button>

在这里，我们将传给处理方法一个名称为name的参数，看一下服务器端的处理：

protected void btnOK_DirectClick(object sender, Ext.Net.DirectEventArgs e)
{System.Threading.Thread.Sleep(3000);string btnName = e.ExtraParams["name"];X.MessageBox.Alert("提示", btnName + "被点击").Show();
}

在服务器端，我们通过e.ExtraParams来访问这些参数。

处理服务器返回的数据

Ext.Net DirectEvents 可以通过添加一个客户端回调方法来处理服务器返回的数据。

<ext:Button runat="server" ID="btnOK"Text="确定" Icon="Accept"><DirectEvents><Click OnEvent="btnOK_DirectClick" Success="fnSuccess"><EventMask ShowMask="true" Msg="正在处理..."></EventMask><ExtraParams><ext:Parameter Name="name" Value="btnOK"></ext:Parameter></ExtraParams></Click></DirectEvents>
</ext:Button>

在配置中添加一个success配置，表示在执行成功以后调用fnSuccess方法，fnSuccess方法的定义如下：

function fnSuccess(response, result) {alert(result.extraParamsResponse.data);
}

接下来看看服务器端如何返回数据的：

        protected void btnOK_DirectClick(object sender, Ext.Net.DirectEventArgs e){e.ExtraParamsResponse.Add(new Ext.Net.Parameter("data", "abc"));}

通过这样的处理，我们就可以从服务器返回数据，并在客户端通过js代码进行处理了，代码效果如下。

confirmation配置

confirmation配置是用来在触发事件之前进行提示，有用户决定是否提交服务器进行处理的。

它的用法很简单，却很实用。

<ext:Button runat="server" ID="btnOK"Text="确定" Icon="Accept"><DirectEvents><Click OnEvent="btnOK_DirectClick" Success="fnSuccess"><EventMask ShowMask="true" Msg="正在处理..."></EventMask><ExtraParams><ext:Parameter Name="name" Value="btnOK"></ext:Parameter></ExtraParams> <Confirmation ConfirmRequest="true"Title="提示" Message="确定要提交服务器吗？">  </Confirmation></Click></DirectEvents>
</ext:Button>

不需要进行多余的代码处理，只要这两行配置就可以完成在出发时间前进行提醒：

Ext.Net DirectEvents除了能够在Ext.Net中很方便的使用之外，还可以结合Asp.Net控件、HTML控件进行使用。

在ASP.NET控件上面使用DirectEvents

我们在ASP.NET中实现无刷新的页面请求的时候，通常会用到UpdatePanel，现在Ext.Net为我们提供了另外一种渠道：通过DirectEvents来实现无刷新的页面请求。

<asp:Label runat="server">名称</asp:Label>
<asp:TextBox runat="server" ID="txtName" />
<asp:Button runat="server" ID="btnOK" Text="确定" />

首先，我在页面放上一个文本框和按钮，当我们点击确定按钮的时候，希望在后台能够取到文本框的值。

接下来才是见证奇迹的时刻：

<ext:ResourceManager runat="server"><CustomDirectEvents>  <ext:DirectEvent Target="btnOK"OnEvent="btnOK_DirectClick"></ext:DirectEvent></CustomDirectEvents>
</ext:ResourceManager>

我们来配置一个DirectEvent，通过这个DirectEvent来执行服务器端的事件方法，我们来看看服务器端的代码：

protected void btnOK_DirectClick(object sender, Ext.Net.DirectEventArgs e)
{string name = this.txtName.Text;X.MessageBox.Alert("提示", "按钮被点击，输入框的值为：" + name).Show();
}

通过这段代码，我们会取到文本框输入的值，并在客户端弹出一个提示框，并且这个过程是无刷新的。效果如下：

在HTML控件上面使用DirectEvents

ASP.NET控件可以用，HTML控件同样可以使用DirectEvents（真的是万能哦）。来看看如何在HTML按钮中使用DirectEvents吧，为了演示，我在上面页面中的按钮替换成HTML按钮：

<input type="button" value="确定" id="htmlBtn" />

然后再ResourceManager节点中配置：

<ext:ResourceManager runat="server"><CustomDirectEvents><ext:DirectEvent Target="htmlBtn"OnEvent="btnOK_DirectClick"></ext:DirectEvent></CustomDirectEvents>
</ext:ResourceManager>

这样就完成了。当我们点击这个HTML按钮的时候，你会看到和上面一样的效果。

DirectEvents调用WebService

DirectEvents除了可以异步执行页面中的事件，还可以远程调用WebService。

新建一个Web服务文件，文件名为ExtNetService 。

    [WebService(Namespace = "http://tempuri.org/")][WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)][System.ComponentModel.ToolboxItem(false)]public class ExtNetService : System.Web.Services.WebService{[WebMethod]public DirectResponse GetServerTimeWindow(){new Window("Server time", Icon.Time){ID = "MyWindow",Html = DateTime.Now.ToString()}.Render();return new DirectResponse();}}

这是我们定义的Service程序，然后来配置DirectEvents：

<ext:ResourceManager runat="server"><CustomDirectEvents><ext:DirectEvent Target="htmlBtn"Url="ExtNetService.asmx/GetServerTimeWindow"Method="POST"Type="Load"></ext:DirectEvent></CustomDirectEvents>
</ext:ResourceManager>

然后点击htmlBtn按钮，这个时候会打开一个来自服务器端的小窗口：

注意这个例子，如果你去跟踪一下请求过程，你会发现这里其实是远程的调用了这个WebService，这里和一般的URL请求是一样的，因此DirectEvents一样可以调用一般处理程序(.ashx)

DirectEvents调用一般处理程序（.ashx）

既然可以远程调用一个WebService，那么远程调用一个一般处理程序肯定是没有问题的。

首先来看看一般处理程序的代码：

public class ServerTimeHandler : IHttpHandler
{public void ProcessRequest(HttpContext context){new Window("Server time", Icon.Time){ID = "MyWindow",Html = DateTime.Now.ToString()}.Render();new DirectResponse().Return();}public bool IsReusable{get{return false;}}
}

然后，我们修改一下DirectEvents配置，将刚才的WebService链接调整一下，其他的不动：

<ext:ResourceManager runat="server"><CustomDirectEvents><ext:DirectEvent Target="htmlBtn"Url="ServerTimeHandler.ashx"Method="POST"Type="Load"></ext:DirectEvent></CustomDirectEvents>
</ext:ResourceManager>

运行程序以后，你会看到与调用WebService一样的效果。

DirectEvents动态生成Ext.Net控件

刚才在演示调用WebService和一般处理程序的时候，已经看到了如何生成Ext.Net控件，再看一下代码：

new Window("Server time", Icon.Time)
{ID = "MyWindow",Html = DateTime.Now.ToString()
}.Render();
return new DirectResponse();

注意，如果要Window显示出来，就必须调用Render方法。

DirectEvents更新ASP.NET控件

我们知道UpdatePanel的更新过程：首先向服务器发送一个异步请求，然后服务器进行重绘，将控件重新生成HTML代码，并返回给客户端，最后，由UpdatePanel客户端JS决定如何替换，达到更新页面的效果。

那么，通过DirectEvents一样可以更新ASP.NET控件。

我们回到第一个例子，通过点击按钮来得到文本框的值。我们在例子中已经完成了取值的过程，接下来我们希望为文本框赋值，代码如下：

        protected void btnOK_DirectClick(object sender, Ext.Net.DirectEventArgs e){this.txtName.Text = "http://www.cnblogs.com/yc-755909659/";this.txtName.Update();}

除了赋值以外，我们还要显示的调用Update方法，不然就会赋值失败。

前面看到了DirectEvents方便调用服务器端方法、DirectEvents调用WebService方法的使用方法，下面我们来看看DirectMethods，这家伙可比DirectEvents更加灵活了，它可以像调用JS方法一样来异步调用服务器端的方法。

使用DirectMethods在JS中调用C#方法

我承认，这个标题有点噱头，其实应该是通过DirectMethods，在JS中通过异步调用的方式执行服务器端的方法。

来看一个例子吧：

[DirectMethod]
public void AddToServerTime(int hours)
{var date = DateTime.Now.Add(new TimeSpan(hours, 0, 0));this.myLabel.Text = date.ToString();
}

这是一个aspx页面中的服务器端方法，为了能够在JS中来调用，必须添加DirectMethod特性。

接下来让我们看看JS调用：

<script type="text/javascript">function fnUpdate() {  App.direct.AddToServerTime(3);}
</script>

就是这句话，它被定义在命名空间App.direct下，当然，这个命名空间是可以修改的，我会在接下来告诉你怎么修改。

然后添加一个按钮，在点击按钮的时候来执行fnUpdate方法。

<ext:Window runat="server" ID="win1" Width="300" Height="200" Title="DirectMethods"><Items><ext:Label runat="server" ID="myLabel"></ext:Label></Items><Buttons><ext:Button runat="server" ID="btnUpdate" Text="更新" Handler="fnUpdate()"></ext:Button></Buttons>
</ext:Window>

我们这里使用的是Ext.Net按钮，你还可以使用Asp.Net按钮，或者是Html按钮，不再细说。

然后我们编译代码，刷新页面，点击这个按钮吧，你会看到window中的显示效果如下：

设置DirectMethods的命名空间

默认情况下，DirectMethods的命名空间是App.direct，我们可以通过N中方法来改变这个默认的命名空间：

在Ext.Net全局配置中更改

<extnet theme="Neptune" directMethodNamespace="MyApp.DirectMethods" />

这种更改方式是在web.config中完成的，如果你不知道怎么在web.config中添加extnet配置节点，那么你肯定是没有看第一篇笔记，去看看吧>>【Ext.Net学习笔记】01：在ASP.NET WebForm中使用Ext.Net

这种更改方式将对所有页面有效。

在Ext.Net ResourceManager配置中更改

<ext:ResourceManager runat="server"DirectMethodNamespace="MyApp.DirectMethods">
</ext:ResourceManager>

这种更改方式是在页面中完成的，它只对当前页面有效，当然了，它肯定是要覆盖全局的设置的。

在DirectMethod特性构造函数中更改

这是最后一种设置方式，它更加灵活，它可以更改某一个方法的命名空间。

[DirectMethod(Namespace = "MyApp.DirectMethods")]
public void AddToServerTime(int hours)
{var date = DateTime.Now.Add(new TimeSpan(hours, 0, 0));this.myLabel.Text = date.ToString();
}

这种方法只对设置的方法有用，它将会覆盖页面和全局的配置。

添加回调方法

前面提到过，Ext.Net DirectMethods和DirectEvents类似，都是通过JS实现的异步调用，因此，如果要处理服务器端的执行结构，就必须在JS中添加相应的回调方法。

function fnUpdate() {MyApp.DirectMethods.AddToServerTime(5, {success: onSuccess,failure: onFailure,eventMask: { showMask: true }});
}function onSuccess() {alert("成功");
}function onFailure() {alert("失败");
}

在这段代码中，我们在调用DirectMethod方法的时候添加了一些配置，包括执行成功和失败的回调方法，以及来显示一个遮罩层，效果如下：

同步执行服务器端方法

一般情况下我们都是采用异步的方式来执行服务器端的方法，这样能够获得更好的用户体验，当然，如果你有怪癖，希望能够通过同步的方式来执行服务器端方法，Ext.Net DirectMethods也是支持的。

[DirectMethod(Namespace = "MyApp.DirectMethods", Async = false)]
public void AddToServerTime(int hours)
{string text = this.btnUpdate.Text;var date = DateTime.Now.Add(new TimeSpan(hours, 0, 0));this.myLabel.Text = text + date.ToString();
}

很简单的一个设置，在DirectMethod构造函数中配置一下就可以了。

郑重的提醒，尽量少用同步的请求，这样会造成浏览器假死的现象，至于什么是浏览器假死，你去试试抢一下春运时候的火车票就知道了

提升性能：调用静态方法

先来说说非静态方法，在执行非静态方法的时候，Ext.Net会提交更多的数据，使我们可以访问页面中的控件这在处理页面相关内容时候非常有用，但是当我们只是想去执行一个处理过程，而与页面无关的时候，我们就可以通过执行静态方法来提升性能。

在静态方法中，我们不能访问页面的Form数据，不能直接访问Request、Response等数据（可以通过HttpContext.Current来访问），好处是在请求的时候，Ext.Net不会将页面数据提交给服务器，大大减少了数据传输和服务器执行的时间。

[DirectMethod(Namespace = "MyApp.DirectMethods")]
public static string AddToServerTime(int hours)
{var date = DateTime.Now.Add(new TimeSpan(hours, 0, 0));return date.ToString();
}

这是我们刚才的方法，现在把它改成了静态方法。JS的调用基本没有改变，只不过我们需要在JS中来更新控件的显示了。

function fnUpdate() {MyApp.DirectMethods.AddToServerTime(5, {success: onSuccess,failure: onFailure,eventMask: { showMask: true }});
}function onSuccess(result) {App.myLabel.setText(result);
}

我们需要对onSuccess回调方法进行修改，在它接收到执行结果之后更新界面显示。

Ext.net.DirectMethod.request调用WebService

DirectMethods不能直接访问WebService，但可以通过Ext.net.DirectMethod.request来请求WebService，实现类似于页面后台方法的效果。

var showRelativeServerTime = function () {Ext.net.DirectMethod.request({url: "EchoService.asmx/Echo",cleanRequest: true,params: {something: "Hello world!"},success: function (result) {alert(Ext.DomQuery.selectValue("string", result, ""));}});
}

这是方法的调用过程，不再演示了。

附加说明：这种方法受用于一切WebService、一般处理程序、MVC等通过url访问的东东，非常好用。

异常处理

这是一个大问题，一般情况下，如果你想偷懒，Ext.Net默认已经帮我们进行了异常处理。当然，如果你想更友好的给用户进行提示，那就来手动处理吧。

[DirectMethod]
public static int Divide(int number1, int number2)
{if (number2 == 0){ResourceManager.AjaxSuccess = false;ResourceManager.AjaxErrorMessage = "number2 can't be zero!";return 0;}return number1 / number2;
}

这样一来，我们手动的判断是否执行成功。当然，你还可以这样写：

[DirectMethod]
public static void DoSomething()
{try{// call through to your business logic layer
    }catch (Exception e){ResourceManager.AjaxSuccess = false;ResourceManager.AjaxErrorMessage = GetFriendlyMessage(e);
    }
}

That's All 。

本文转自叶超Luka博客园博客，原文链接：http://www.cnblogs.com/yc-755909659/p/3755323.html，如需转载请自行联系原作者

【Ext.Net学习笔记】03：Ext.Net DirectEvents用法详解、DirectMethods用法详解相关推荐

  1. Ext.Net学习笔记22：Ext.Net Tree 用法详解

    上面的图片是一个简单的树,使用Ext.Net来创建这样的树结构非常简单,代码如下: <ext:TreePanel runat="server"><Root> ...

  2. Ext.Net学习笔记18：Ext.Net 可编辑的GridPanel

    Ext.Net GridPanel 有两种编辑模式:编辑单元格和编辑行. 单元格编辑: 行编辑: 可以看出,单元格编辑的时候,只有单元格会进入编辑模式,而行编辑模式中则对编辑行的所有可编辑字段统一进行 ...

  3. Ext.Net学习笔记19：Ext.Net FormPanel 简单用法

    Ext.Net学习笔记19:Ext.Net FormPanel 简单用法 FormPanel是一个常用的控件,Ext.Net中的FormPanel控件同样具有非常丰富的功能,在接下来的笔记中我们将一起 ...

  4. Ext.Net学习笔记10：Ext.Net ComboBox用法

    ComboBox是最常用的控件之一,它与HTML中的Select控件很像,但可以进行多选.自定义显示格式.分页等. ComboBox用法 <ext:ComboBox runat="se ...

  5. Ext.Net学习笔记20：Ext.Net FormPanel 复杂用法

    Ext.Net学习笔记20:Ext.Net FormPanel 复杂用法 在上一篇笔记中我们介绍了Ext.Net的简单用法,并创建了一个简单的登录表单.今天我们将看一下如何更好是使用FormPanel ...

  6. Git 的安装与初次使用 —— Git 学习笔记 03

    Git 的安装与初次使用 -- Git 学习笔记 03 Git 的安装与初次使用 -- Git 学习笔记 03 安装 Git 在 Linux 上安装 在 Windows 上安装 初次运行 Git 前的 ...

  7. JavaWeb黑马旅游网-学习笔记03【登陆和退出功能】

    Java后端 学习路线 笔记汇总表[黑马程序员] JavaWeb黑马旅游网-学习笔记01[准备工作] JavaWeb黑马旅游网-学习笔记02[注册功能] JavaWeb黑马旅游网-学习笔记03[登陆和 ...

  8. HTML/CSS学习笔记03【CSS概述、CSS选择器、CSS属性、CSS案例-注册页面】

    w3cschool菜鸟教程.CHM(腾讯微云):https://share.weiyun.com/c1FaX6ZD HTML/CSS学习笔记01[概念介绍.基本标签.表单标签][day01] HTML ...

  9. JDBC学习笔记03【JDBC事务管理、数据库连接池、JDBCTemplate】

    黑马程序员-JDBC文档(腾讯微云)JDBC笔记.pdf:https://share.weiyun.com/Kxy7LmRm JDBC学习笔记01[JDBC快速入门.JDBC各个类详解.JDBC之CR ...

最新文章

  1. 深度学习下的医学图像分析 2
  2. 【揭秘】12306是如何抗住几亿日活、百万级高并发的？
  3. 第一个程序---汇编学习笔记
  4. android:layout_gravity=end,Android中 layout_gravity和gravity的区别
  5. CRM的business partner和employee在后台的搜索
  6. [mybatis]映射文件_参数处理
  7. [转]自定义SqlMembershipProvider方法
  8. WORD如何隐藏选中内容？
  9. @SuppressWarnings
  10. python：随机产生n个数
  11. IP地址、网络号、主机号、网络地址、子网掩码、网关、192.168.0.1/24是什么意思
  12. 中国童装十大品牌是什么？
  13. 网上咋打印?网上打印资料文件的平台有哪些
  14. BIOS工程师需要掌握的知识
  15. 《Microduino实战》——1.3　开源软件
  16. jvm性能分析工具之-- Eclipse Memory Analyzer tool(MAT)（二）
  17. 程序员理财之如何靠中国特色打新股赚钱
  18. linux下如何拷贝软链接
  19. 什么是JMS(消息服务)
  20. 播放器音乐源之天天动听API

热门文章

  1. 关于gcc -m32 -o 编译错误： /usr/bin/ld: cannot find -lgcc
  2. 已购买阿里云CDN流量包仍旧扣费的原因及解决方法
  3. 链接计算机网络密码错误,手机连不上路由器显示密码错误怎么办？
  4. 华夏银行笔试c语言,华夏银行笔试经验分享
  5. 华硕ASUS RT-AC66U无线路由器部署NTP Server最佳实践
  6. 运动无线蓝牙耳机推荐、运动健身必备的运动耳机
  7. 鸿蒙应用开发：实现简单的媒体播放器
  8. Python练习题——初学Python记录
  9. Python学习记录——십 列表
  10. iOS信鸽推送：解决通过账号推送不成功的问题