zoukankan      html  css  js  c++  java
  • Ext.Net学习笔记07:Ext.Net DirectMethods用法详解

    前面两篇内容中,我们看到了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中的显示:

    image

    设置DirectMethods的命名空间

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

    在Ext.Net全局配置中更改

    <extnet theme="Neptune" 

    directMethodNamespace="MyApp.DirectMethods

    " />

    这种更改方式是在web.config中完成的,如果你不知道怎么在web.config中添加extnet配置节点,那么你肯定是没有看我的第一篇笔记,去看看吧>>在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构造函数中配置一下就可以了。

    郑重的提醒,尽量少用同步的请求,这样会造成浏览器假死的现象,至于什么是浏览器假死,你去试试抢一下春运时候的火车票就知道了(这里说的是2014年春运的火车票,今天是2014年1月16日,目前12306的验证码校验用的就是同步请求,不知道有多少同学被卡死在校验验证码的路上……)

    提升性能:调用静态方法

    先来说说非静态方法,在执行非静态方法的时候,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);
            // Do any logging and other operations here
        }
    }

    OK,Ext.Net DirectMethods的用法就介绍这么多,希望可以帮到你们。

  • 相关阅读:
    SharePoint 2013 商务智能报表发布
    sharepoint designer web 服务器似乎没有安装microsoft sharepoint foundation
    SharePoint 2013 Designer系列之数据视图
    SharePoint 2013 Designer系列之数据视图筛选
    SharePoint 2013 Designer系列之自定义列表表单
    SharePoint 2013 入门教程之创建及修改母版页
    SharePoint 2013 入门教程之创建页面布局及页面
    SharePoint 2010 级联下拉列表 (Cascading DropDownList)
    使用SharePoint Designer定制开发专家库系统实例!
    PL/SQL Developer 建立远程连接数据库的配置 和安装包+汉化包+注册机
  • 原文地址:https://www.cnblogs.com/youring2/p/3556097.html
Copyright © 2011-2022 走看看