程序博客网 > 医疗器械 软件确认

Ext.Net 1.2.0_Ext.net.DirectMethods 使用

来源：互联网 发布：医疗器械 软件确认 编辑：程序博客网 时间：2024/06/14 23:25

文章转自http://www.cnblogs.com/liuning8023/archive/2012/04/20/2460629.html


http://examples.ext.net/#/Events/DirectMethods/Overview/

 

本文在几个月前写过一次，当时刚刚使用 Ext.Net，现在重新整理一下，说说自己的理解，并附上源代码。 本 Blog 的文章我可能因为翻译问题，代码问题，理解问题，表述问题等等，都会不定期的重新整理发一下。

 

本文内容

  • DirectMethod 基础
  • 从 DirectMethod 返回一个字符串
  • 给 DirectMethod 传递多个参数
  • 调用 DirectMethod 静态方法，并返回一个字符串
  • 从静态 DirectMethod 返回一个自定义对象
  • 禁用 DirectMethod ClientProxy 的创建
  • 向代理函数传递 DirectMethod 配置

 

DirectMethod 提供了一种直接在客户端 JavaScript 代码中调用服务器端 .Net 方法的功能。

用 [DirectMethod] 属性来修饰服务器端 public 或 public static 属性的方法，会向客户端 JavaScript 代码“公开”服务器端方法。

注意：服务器端方法必须用 public 或 public static 修饰符。

 

这种调用服务器端方法往往很好用，可以解决很多动态创建控件和数据加载问题（例如，根据权限动态创建按钮），以及它们造成的页面呈现问题。

例如，当页面很多控件都是动态时，每次刷新页面，Ext.Net 在获得数据后，都会自己重新按照它的式样呈现数据，此时可能报脚本错误。

我经常遇到的情况是，Ext.Net.GridPanel 和 Ext.Net.Store 刷新问题。Ext.Net 的处理顺序是，先把数据加载到 Store 里（如 Store.DataSource=new DataTable(); Store.DataBind(); ），然后再用 GridPanel 呈现。因此，如果你的顺序是反的。先为 GridPanel 动态创建行或组按钮，再调用GridPanel.Render()，之后，向 Store 绑定数据，就很可能出现刷新问题。

假设你只使用了 Page_Load 事件进行页面初始化，并在初始化时进行 if(!IsAjaxRequest) {…} 判断。如果 debug 程序，那么，Ext.Net 框架在页面第一次初始化时，IsAjaxRequest==false，表明这第一次不是 Ajax 请求。当你对页面进行操作，并调用了服务器端方法时，无论是通过 Ext.Net 何种方式调用，之后就全是 Ajax 请求，即 IsAjaxRequest==true，此时，与 ASP.NET 程序相比，你会发现很多方法都会执行，而且有些方法会反复执行很好几次。这就是 Ajax 程序的特点——多次向服务器端请求资源，只要它需要。并且，这些请求都是局部刷新页面。

所以，我通常是，在页面初始化时，如 Page_Load，尽量先将页面的整体情况呈现给客户，即 if(!IsAjaxRequest) {…} 里的代码。然后，根据用户对页面的动作，通过直接调用服务器端方法，获得数据，呈现给用户。

事前想好，如何呈现你的页面给用户其实重要。能很大程度减少页面刷新次数、页面响应时间，提升页面性能。

 

DirectMethod 基础

下面演示 DirectMethod 一个简单的例子，更新 <ext:Label> 控件。

<%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
 
    <script runat="server">
   1:  
   2:         [DirectMethod]
   3:         public void SetTimeStamp()
   4:         {
   5:             this.Label1.Text = DateTime.Now.ToLongTimeString();
   6:             this.Label1.Element.Highlight();
   7:         }
   8:     
</script>
 
</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server" />
    <ext:Button ID="Button1" runat="server" Text="Click Me" Icon="Lightning">
        <Listeners>
            <Click Handler="Ext.net.DirectMethods.SetTimeStamp();" />
        </Listeners>
    </ext:Button>
    <br />
    <ext:Label ID="Label1" runat="server" Text='<%# DateTime.Now.ToLongTimeString() %>'
        Format="Server Time: {0}" />
    </form>
</body>
</html>

运行结果：

DirectMethod 基础

图1 DirectMethod 基础

说明

  • 在 Button1 客户端事件里，调用服务器端方法 SetTimeStamp 来更新 Label1 控件，并高亮显示。
  • 另外，在 Ext.Net，当第一次请求页面时（此时为回发），IsAjaxRequest 为 false，之后为 true，因为之后的请求是 Ajax 请求。

从 DirectMethod 返回一个字符串

DirectMethod 会返回任何类型的对象。该对象序列化后，作为 result 参数发送给在 DirectMethod 中配置的回调函数 success（DirectMethod 方法成功时的客户端处理函数）。

<%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
 
    <script runat="server">
   1:  
   2:         [DirectMethod]
   3:         public string GetTimeStamp()
   4:         {
   5:             return DateTime.Now.ToLongTimeString();
   6:         }
   7:     
</script>
 
</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server" />
    <ext:Button ID="Button2" runat="server" Text="Click Me" Icon="Lightning">
        <Listeners>
            <Click Handler="
            Ext.net.DirectMethods.GetTimeStamp({
                success: function (result) {
                    Ext.Msg.alert('Server Time', result);
                }
            });" />
        </Listeners>
    </ext:Button>
    </form>
</body>
</html>

运行结果：

从 DirectMethod 返回一个字符串

图2 从 DirectMethod 返回一个字符串

说明

  • 在 Button1 客户端事件中，Ext.net.DirectMethods.GetTimeStamp(…) 是在客户端调用服务器端的方法 GetTimeStamp，success 是Ext.net.DirectMethods 配置的回调函数，也就是说，当服务器端方法成功返回时，客户端需要根据返回值执行的操作。本例中，如果服务器端方法GetTimeStamp() 成功返回服务器端当前时间，则客户端弹出这个时间警告。

给 DirectMethod 传递多个参数

如果服务器端 [DirectMethod] 方法要求参数，那么也要客户端 DirectMethod 传递给它相应的参数。

本例中，如果服务器端要求两个参数：sting 和 int，那么在客户端也要传递两个可靠的参数给服务器端的 [DirectMethod] 方法。

<%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
 
    <script runat="server">
   1:  
   2:         [DirectMethod]
   3:         public void LogCompanyInfo(string name, int count)
   4:         {
   5:             string template = string.Concat("{0} has approximately {1} employees.");
   6:             string[] employees = new string[4] { "1-5", "6-25", "26-100", "100+" };
   7:  
   8:             this.Label1.Text = string.Format(template, name, employees[count]);
   9:         }
  10:     
</script>
 
</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server" />
    <ext:Button ID="Button1" runat="server" Text="Click Me">
        <Listeners>
            <Click Handler="Ext.net.DirectMethods.LogCompanyInfo('Ext.NET, Inc.', 0);" />
        </Listeners>
    </ext:Button>
    <br />
    <ext:Label ID="Label1" runat="server" />
    </form>
</body>
</html>

运行结果：

给 DirectMethod 传递多个参数

图3 给 DirectMethod 传递多个参数

调用 DirectMethod 静态方法，并返回一个字符串（Super Fast + Best Performance）

当调用一个 public 服务端方法，默认情况下，在执行整个页面生命期时，这个方法可以访问页面上所有 Web 控件。

而带 static 的 [DirectMethod] 方法，不会执行页面生存期，并且不能访问页面 Web 控件。这减少了处理开销，优化了性能。

<%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
 
    <script runat="server">
   1:  
   2:         [DirectMethod]
   3:         public static string GetTimeStamp()
   4:         {
   5:             return DateTime.Now.ToLongTimeString();
   6:         }
   7:     
</script>
 
</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server" />
    <ext:Button runat="server" Text="Click Me" Icon="Lightning">
        <Listeners>
            <Click Handler="
            Ext.net.DirectMethods.GetTimeStamp({
                success: function (result) {
                    Ext.Msg.alert('Server Time', result);
                }
            });" />
        </Listeners>
    </ext:Button>
    </form>
</body>
</html>

运行结果：

调用 DirectMethod 静态方法，并返回一个字符串（Super Fast + Best Performance）

图4 调用 DirectMethod 静态方法，并返回一个字符串

说明

  • Button1 客户端事件调用服务器端静态方法 GetTimeStamp()，获得服务器端当前时间。

注意：服务器端静态方法 GetTimeStamp() 中不能访问页面中的 Web 控件。

从静态 DirectMethod 返回一个自定义对象

DirectMethod 可以返回任何类型的对象。下面例子创建并返回一个 Customer 对象。

Customer 对象被序列化成 JSON，返回给客户端。在 DirectMethod 配置中，result 参数就是从服务器端返回的 Customer 对象。

<%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
 
    <script runat="server">
   1:  
   2:         // Define Customer Class
   3:         public class Customer
   4:         {
   5:             public int ID { get; set; }
   6:             public string FirstName { get; set; }
   7:             public string LastName { get; set; }
   8:             public string Company { get; set; }
   9:             public Country Country { get; set; }
  10:             public bool Premium { get; set; }
  11:         }
  12:         // Define Country Class
  13:         public class Country
  14:         {
  15:             public string Name { get; set; }
  16:         }
  17:         [DirectMethod]
  18:         public static Customer GetCustomer()
  19:         {
  20:             return new Customer()
  21:             {
  22:                 ID = 99,
  23:                 FirstName = "Peter",
  24:                 LastName = "Smith",
  25:                 Company = "CompanyX, LLC.",
  26:                 Premium = true,
  27:                 Country = new Country { Name = "Canada" }
  28:             };
  29:         }
  30:     
</script>
 
</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server" />
    <ext:Button ID="Button1" runat="server" Text="Click Me" Icon="Lightning">
        <Listeners>
            <Click Handler="
            Ext.net.DirectMethods.GetCustomer({
                success : function (customer) {
                    var template = 'ID : {0}{6} Name : {1} {2}{6} Company : {3}{6} Country : {4}{6} Premium Member : {5}',
                        msg = String.format(template, 
                                customer.ID, 
                                customer.FirstName, 
                                customer.LastName, 
                                customer.Company, 
                                customer.Country.Name, 
                                customer.Premium);                    
                    Ext.Msg.alert('Customer', msg);
                }
            });" />
        </Listeners>
    </ext:Button>
    </form>
</body>
</html>

运行结果：

从静态 DirectMethod 返回一个自定义对象

图5 从静态 DirectMethod 返回一个自定义对象

说明

  • 定义两个类 Customer 和 Country，Country 聚合在 Customer；
  • 服务器端静态方法 GetCustomer() 创建 Customer 对象返回给客户端。

注意：客户端如何访问对象 Customer。

禁用 DirectMethod ClientProxy 的创建

当服务器端方法添加 [DirectMethod] 属性，默认情况下，将会在客户端的 Ext.net.DirectMethods 创建一个相同名字、接受相同参数的 JavaScript 函数。

例如，如果创建一个名为 GetTimeStamp 服务器端方法，那么在客户端，也会创建一个相应的 Ext.net.DirectMethods.GetTimeStamp 的 JavaScript 函数。

有种情况，当开发者创建了一个 [DirectMethod]，但是想隐藏相应的客户端 JavaScript 函数。此时，你可以在某个 [DirectMethod] 属性里设置它的ClientProxy.Ignore 属性，从而忽略创建相应的客户端 JavaScript 函数。

如果 [DirectMethod] 设置为 ClientProxy.Ignore，将不会创建相应的客户端代理函数（client-side proxy function），但是 [DirectMethod] 仍然可以被调用。[DirectMethod] 代理函数是围绕底层 Ext.net.DirectMethod.request() 函数的封装。

通过配置 Ext.net.DirectMethod.request() 函数，即便没有客户端代理函数，任何服务器端 [DirectMethod] 都可以被直接调用。

Ext.net.DirectMethod.request() 方法原型如下：

request ( string methodName , [Object options] ) : void
Calls the server-side [DirectMethod] as specified in the methodName parameter.
Parameters:
methodName : String
The server-side Method name to call.
options : Object
(optional) An object containing configuration properties. This options object may contain any of the following properties, or options as defined in Ext.Ajax.request.
success : Function
The JavaScript function to invoke on successful response from the DirectMethod.
The "result" parameter is passed to the success function.
failure : Function
The JavaScript function to invoke if a failure response is returned from the DirectMethod.
The "errorMessage" parameter is passed to the success function.
specifier : String
The server-side Method access specifier, options inlcude ("public", "static").
The specifier of "public" is the default value and does not need to be explicitly set.
If the server-side Method is a static Method, the specifier options must be set to "static".
method : String
The type of http request to make, options include ("POST", "GET").
The method of "POST" is the default value.
url : String
A custom url to call the DirectMethod from. The DirectMethod does not need to be configured on the "Parent Page".
If no url is provided, the request options will use the <;form>'s action attribute. If the action attribute is empty, the request options will use the window.location.href value. If the window.location.href value ends with a forward-slash ("/"), the IIS web server may not be able to process the "POST" request. Under this scenario, you must set the "method" options property to "GET".
control : String
The ID of the UserControl which contains the DirectMethod. An DirectMethod can be configured within a .ascx file and called from a Parent .aspx Page.
timeout : Number
The timeout in milliseconds to be used for requests. (defaults to 30000)
eventMask : Object
(optional) An EventMask options object. This options object may contain any of the following properties:
showMask : Boolean
true to show mask (defaults to false).
msg : String
The text to display in a centered loading message box (defaults to 'Working...').
msgCls : String
The CSS class to apply to the loading message element (defaults to "x-mask-loading")
target : String
The target element to apply the mask to, options include ("page", "customtarget").
If "customtarget", the customTarget configuration option should be set.
customTarget : String
The id of the target element, or a instance of the target element.
minDelay : Number
The minimum amount of time to display the mask (defaults to 0).
Setting the minDelay provides and minimum amount of time to display a message to the user before removing mask and executing success, failure and/or callback functions.
Returns:
void
<%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
 
    <script runat="server">
   1:  
   2:         [DirectMethod(ClientProxy = ClientProxy.Ignore)]
   3:         public string GetTimeStamp()
   4:         {
   5:             return DateTime.Now.ToLongTimeString();
   6:         }
   7:     
</script>
 
</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server" />
    <ext:Button ID="Button1" runat="server" Text="Click Me" Icon="Lightning">
        <Listeners>
            <Click Handler="Ext.net.DirectMethod.request(
            'GetTimeStamp', 
            {
                success: function (result) { 
                    Ext.Msg.alert('Message', result); 
                } 
            });" />
        </Listeners>
    </ext:Button>
    </form>
</body>
</html>

运行结果：

禁用 DirectMethod ClientProxy 的创建

图6 禁用 DirectMethod ClientProxy 的创建

向代理函数传递 DirectMethod 配置

DirectMethod 配置对象可以被作为最后一个参数传递给任何 DirectMethod 代理函数。

<%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
 
    <script runat="server">
   1:  
   2:         [DirectMethod]
   3:         public string LogMessage(string msg)
   4:         {
   5:             // Log the message somewhere...
   6:             return msg;
   7:         }
   8:     
</script>
 
</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server" />
    <ext:Button ID="Button4" runat="server" Text="Click Me" Icon="Lightning">
        <Listeners>
            <Click Handler="Ext.net.DirectMethods.LogMessage('Hello World', {
                    success: function (result) { 
                        Ext.Msg.alert('Message', result); 
                    },
                    eventMask: {
                        showMask: true,
                        minDelay: 500
                    }
                });" />
        </Listeners>
    </ext:Button>
    </form>
</body>
</html>

运行结果：

向代理函数传递 DirectMethod 配置

图7 向代理函数传递 DirectMethod 配置

 

下载 Demo

医疗器械 软件确认 医疗器械 软件确认
原创粉丝点击
热门IT博客
淘宝售后服务流程图淘宝售后服务流程图
apache源码分析apache源码分析
简单的网络管理协议
邮箱服务器端口
淘宝 赚 佣金
myeclipse导入java项目
水果机源码
android 调用java接口
淘宝闲鱼拍卖是真品吗
北京立方米网络怎么样
嫁给大山的女人知乎
淘宝 官网
java可视化编程实例
淘宝申诉留言怎么写
淘宝店铺怎么彻底关闭
jdk8 mac x64
网文每天一万字 知乎
java 秒杀倒计时代码
淘宝虚假交易
小区网络监控布线
热门问题 老师的惩罚 人脸识别 我在镇武司摸鱼那些年 重生之率土为王 我在大康的咸鱼生活 盘龙之生命进化 天生仙种 凡人之先天五行 春回大明朝 姑娘不必设防，我是瞎子 第一座佛教寺院 寺院早课唱诵大全 2018寺院工作人员招聘 金刚经寺院唱诵版mp3 2018寺院招聘发心出家者 十六观门寺院唱诵 寺院里放的南无阿弥陀佛歌曲 一个寺院一袈裟打一生肖 心经寺院唱诵 佛经晚课寺院版唱诵 金刚经读诵寺院版 心经唱诵寺院版 70道寺院素菜谱 北京寺庙大全 庙宇图片 西藏寺庙排名 中国寺庙图片 佛说阿弥陀经寺院唱诵 心经21遍快诵寺院版 佛说阿弥陀经寺院版 中国第一座佛教寺院是哪一座 梁皇宝忏五台山寺院唱诵 李娜出家在哪一座寺院 寻情 寻乌 寻 寻寻 寻客 寻艺 寻缘 寻线 寻木 寻鹿 寻青藤谍影风云 民国谍影寻青藤 谍影风云寻青藤 寻麻疹图片初期 寻梦环游记 寻麻疹几天能好 寻乌在线 爱寻迷

程序博客网，程序员的互联网技术博客家园。csdn论坛精品 msdn技术资料都在这里