分享

Ext.Net 1.2.0_Ext.net.DirectMethods 使用

 liyan1371 2014-07-24
免费计数器申请

 

本文在几个月前写过一次,当时刚刚使用 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./TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www./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 中配置的回调函数 successDirectMethod 方法成功时的客户端处理函数)。

<%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www./TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www./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(…) 是在客户端调用服务器端的方法 GetTimeStampsuccess 是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./TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www./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./TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www./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./TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www./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:         {

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多