Ext.Net学习笔记06:Ext.Net DirectEvents用方补充
在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="HTML按钮" 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。
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
// 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务,请取消注释以下行。
// [System.Web.Script.Services.ScriptService]
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)
{
//string name = this.txtName.Text;
//X.MessageBox.Alert("提示", "按钮被点击,输入框的值为:" + name).Show();
this.txtName.Text = "www.qeefee.com"
;
}
这里是标准的赋值方式,如果在ASP.NET UpdatePanel中肯定可以完成我们想要的功能,但是在Ext.Net中并不行的,不信你可以试试……反正我是试过了。
那么如何来更新ASP.NET控件呢?我来告诉你答案:
protected void btnOK_DirectClick(object sender, Ext.Net.DirectEventArgs e)
{
//string name = this.txtName.Text;
//X.MessageBox.Alert("提示", "按钮被点击,输入框的值为:" + name).Show(); this.txtName.Text = "www.qeefee.com";
this.txtName.Update();
}
看到了吧,除了赋值以外,我们还要显示的调用Update方法。
需要说明一下,这个Update方法是Ext.Net中的静态方法,要用它的时候你必须添加Ext.Net的引用。
太复杂的控制我没有试过,希望以后有机会尝试吧。希望这篇文章能够帮到大家……别忘了,这是起飞网原创首发哦
Ext.Net学习笔记06:Ext.Net DirectEvents用方补充的更多相关文章
- 【Ext.Net学习笔记】03:Ext.Net DirectEvents用法详解、DirectMethods用法详解
Ext.Net通过DirectEvents进行服务器端异步的事件处理.[Ext.Net学习笔记]02:Ext.Net用法概览.Ext.Net MessageBus用法.Ext.Net布局 中已经简单的 ...
- 【Ext.Net学习笔记】06:Ext.Net GridPanel的用法(GridPanel 折叠/展开行、GridPanel Selection、 可编辑的GridPanel)
GridPanel 折叠/展开行 Ext.Net GridPanel的行支持折叠/展开功能,这个功能个人觉得还说很有用处的,尤其是数据中包含图片等内容的时候. 下面来看看效果: 使用行折叠/展开功能之 ...
- 【Ext.Net学习笔记】04:Ext.Net中使用数据、Ext.Net Store的用法、Ext.Net ComboBox用法
之前的几篇文章都是介绍Ext.Net较为基础的东西,今天的这一篇将介绍数据的一些用法,包括XTemplate绑定数据.Store(Modal.Proxy).ComboBox的用法等. XTemplat ...
- 【Ext.Net学习笔记】02:Ext.Net用法概览、Ext.Net MessageBus用法、Ext.Net布局
Ext.Net用法概览 Ext.Net还是很强大,如果运用熟练可以极大的提高编程效率.如果你也要学习Ext.Net,原文博主推荐书籍:<Ext.Net Web 应用程序开发教程>,是英文的 ...
- Ext.Net学习笔记23:Ext.Net TabPanel用法详解
Ext.Net学习笔记23:Ext.Net TabPanel用法详解 上面的图片中给出了TabPanel的一个效果图,我们来看一下代码: <ext:TabPanel runat="se ...
- 【Ext.Net学习笔记】05:Ext.Net GridPanel的用法(包含Filter、Sorter、Grouping、汇总(Summary)的用法)
GridPanel是用来显示数据的表格,与ASP.NET中的GridView类似. GridPanel用法 直接看代码: <ext:GridPanel runat="server&qu ...
- 【Ext.Net学习笔记】01:在ASP.NET WebForm中使用Ext.Net
Ext.NET是基于跨浏览器的ExtJS库和.NET Framework的一套支持ASP.NET AJAX的开源Web控件,包含有丰富的Ajax运用,其前身是Coolite. 下载地址:http:// ...
- Ext JS4 学习笔记之发送表单(Form)时也将表单下的表格(Grid)数据一同发送的方法
Ext JS4 学习笔记之发送表单(Form)时也将表单下的表格(Grid)数据一同发送的方法 昨天在开发的时候遇到个小问题,就是如何将Grid的内容与Form一起发送到服务器端.默认情况下,表单(F ...
- Ext.Net学习笔记22:Ext.Net Tree 用法详解
Ext.Net学习笔记22:Ext.Net Tree 用法详解 上面的图片是一个简单的树,使用Ext.Net来创建这样的树结构非常简单,代码如下: <ext:TreePanel runat=&q ...
随机推荐
- c++ 读取并解析excel文件方法
用Cocos开发模型特效工具编辑器,跨Mac和windows,当中有个需求是读取并解析excel文件,但网上的查找的例子几乎都只能是在windows下面使用,再或者是命令行脚本之类的.于是,自己写了一 ...
- [原]H264帧内预测
帧内预测模块大小 说明 4x4(亮度) 预测方式9种 8x8(亮度) 预测方式9种.只有high profile才有 16x16(亮度) 预测方式4种,只依赖左,上数据. 8x8(色度) 预测方式4种 ...
- javaweb之javascript结合(三)
1.案例一:在末尾添加节点 第一步:获取到ul标签 第二步:创建li标签 document.createElement("标签名称")方法 第三步:创建文本 document.cr ...
- [TVYJ1096]数字组合
时间: 1000ms / 空间: 131072KiB / Java类名: Main 描述 在N个数中找出其和为M的若干个数.先读入正整数N(1<N<100)和M(1<M<100 ...
- wuzhicms模版语法
在模版中使用的语法规则: 例如:templates/default/content/show.html 1.变量表示 {$title} 被解析成 <?php echo $title;?> ...
- Extjs 4.x 得到form CheckBox的值
CheckBox(复选框)主要用来接收用户选择的选项 如图所示(请忽略UI的不好看): 该弹出窗口的主要代码如下: var win = new Ext.Window({ modal : true, t ...
- 【原创】Java移位运算
学习移位运算,首先得知道参与移位运算的类型的位数,那先来复习下Java基础类型的占位数吧. Java基础类型 Java基础类型总结一览表 类型 二进制位数 最大值 最小值 初始化值 表示形式 带符号 ...
- hdoj 2568 前进
前进 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submissi ...
- Android UI--自定义ListView(实现下拉刷新+加载更多)
Android UI--自定义ListView(实现下拉刷新+加载更多) 关于实现ListView下拉刷新和加载更多的实现,我想网上一搜就一堆.不过我就没发现比较实用的,要不就是实现起来太复杂,要不就 ...
- hdu 2711&&poj2182 Lost Cows (线段树)
从后往前查第一个为0的奶牛肯定应该排在第一个.每次从后往前找到第一个为0的数,这个数应该插在第j位.查找之后,修改节点的值为极大值,当整棵树的最小值不为0的时候查找结束. 至于这种查找修改的操作,再没 ...