Ext.Net学习笔记06：Ext.Net DirectEvents用方补充

上一篇中介绍了Ext.Net DirectEvents的详细使用方法，包括传递和接收参数、显示遮罩层、进行提示等。

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="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的引用。

太复杂的控制我没有试过，希望以后有机会尝试吧。