帮酷LOGO
0 0 评论
  • 显示原文与译文双语对照的内容
文章标签:控制  用户控制  用户  USE  

介绍

在开发使用AJAX功能的ASP.NET 网站时,你迟早会意识到开发基于AJAX的web控件的过程会变得重复: 你最终编写了相同的JavaScript,用于创建和处理客户端上的XmlHttpRequest,以及服务器端。 在这一点上,你可能已经有一个外部javascript文件中引用你的主页,然后你意识到这一切开始演变成一些javascript炸毁怪物。 至少我也这么觉得。 当我不得不面对一个需要在一个页面上多次实例化的控件的问题时,我会停止并思考一个更优雅的解决问题的方法。 如果我有一个抽象的AJAXControl 类,我可以从中派生控件,只添加该控件显式使用的JavaScript ( 和server-side处理)?

背景

你需要了解的内容是AJAX如何工作。 我将不会详细介绍这一点,我将在这里展示如何创建一个基本类,它允许AJAX开发最少的工作。 你将看到单个控件如何将它的内容呈现为处理 client-side JavaScript请求,如何将JavaScript嵌入自定义控件 DLL,以及如何注册它。

使用代码

只要解压源代码。 这里有主项目 AbstractAjaxControl,它包含抽象控件以及来自我们抽象基类( 因此可以被实例化)的演示控件,以及一个使用该演示控件的简单网站。

捕获AJAX请求

我将只讨论使用HTTP_POST发布的AJAX请求。 在实际发送数据之前,AJAX POST请求由两行JavaScript触发:

httpRequest.open('POST', uri, true);

其中,'POST'指定我们要使用 HTTP_POST,uri 是我们发送到的文档的地址,最后一个参数将请求设置为阻塞(,)。 yf_terminology_false@#@#@#false_yf_terminology ,同步) 或者 non-blocking ( yf_terminology_true@#@#@#true_yf_terminology 异步)。

httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

这告诉JavaScript发送请求,就好像一个表单被发送。 通过单击提交按钮或者通过按如下方式发送 XmlHttpRequest的方式发送表单没有区别,这就是我们使用的方法: ASP.NET 识别 Request.Form 属性,但它确实识别 postback 事件。 这是 ASP.NET-driven 网站上非常罕见的条件,所以我们将使用它。

我们希望抽象基类处理上述条件;我们希望派生类只实现AJAX请求的响应方式。 为此,我声明了 专用 事件 AjaxRequest:

privatedelegatevoid AjaxRequestEventHandler(object sender, AjaxRequestEventArgs e);privateevent AjaxRequestEventHandler AjaxRequest;privatevoid OnAjaxRequest()
{
 if (AjaxRequest!= null)
 AjaxRequest(this, new AjaxRequestEventArgs(Page.Request.Form));
}

AjaxRequestEventArgs 是一个 EventArgs 类,它将 Request.Form NameValueCollection 中的所有表单元素存储在它的public 属性 Parameters 中。

问题是:什么时候触发事件?

  • 没有 postback 事件
  • 我们的Request.Form NameValueCollection 中有内容
  • 这里内容在控件的范围内是相关的,比如
  • 在页面的其他部分被初始化( 或者呈现) 之前

参见点c ),我们需要一个变量来设置范围,我们需要所有的javascript发送数据来传递这个数据的范围。 我做了这个 server-side,通过声明 专用 具有公共可用属性 Scope ( 可以并且应该通过派生类以声明方式设置)的成员 _scope。 如果在一个页面中从我们的抽象类派生多个控件,Scope 将派派用场。

找到合适的触发 AjaxRequest的时机是很容易的,因为它是。 我们需要重写 OnInit 方法。

if (!Page.IsPostBack && Page.Request.Form["scope"] == _scope)
 OnAjaxRequest();base.OnInit(e);

就是这样,对于AJAX请求的server-side处理来说。 不过,不要忘记订阅事件,并告诉所有派生类它们绝对必须实现一个方法来处理AJAX请求:

public AjaxControl()
{
 AjaxRequest += new AjaxRequestEventHandler(HandleAjaxRequest);
}protectedabstractvoid HandleAjaxRequest();

我们需要多少 JavaScript?

我们是half-way完成。记住,我们不希望任何blown-upjavascript文件中引用,需要主页? 我们想要一个基本javascript被所有控件使用来自我们的抽象基类,加上小片段的javascript定义派生的行为控制和部署只有这些。 思考一下:你可以在常见的AJAX控件中考虑什么? 什么JavaScript函数属于基本功能?

  • ( 全局) XmlHttpRequest 对象的声明
  • 创建此类对象的函数
  • 准备给定数据并发送它们的函数

所有AJAX的区别在于处理响应的JavaScript,所以我们不能把它放在基本的JavaScript文件中。 剩下的是:

var httpRequest = null;function CreateRequest()
{
 if (window.XMLHttpRequest)
 httpRequest = new XMLHttpRequest();
 elseif (window.ActiveXObject)
 httpRequest = new ActiveXObject("Msxml2.XMLHTTP");
}function SendRequest(parameters, responseHandler)
{
 if(httpRequest == null)
 CreateRequest();
 httpRequest.open('POST', document.location.href, true);
 httpRequest.setRequestHeader('Content-Type', 
 'application/x-www-form-urlencoded');
 httpRequest.onreadystatechange = responseHandler;
 strPostData = "";
 for(i = 0; i <parameters.length; i++)
 {
 strPostData += parameters[i] + "=";
 i++;
 strPostData += parameters[i];
 if(i + 1!= parameters.length)
 strPostData += "&";
 }
 httpRequest.send(strPostData);
} 

我的全局 XmlHttpRequest 对象是 httpRequest,它是在( 当它被需要的时候)。 在 CreateRequest 方法中,我首先检查 XmlHttpRequest 是否已知(。用于 IE 7,Opera,Mozilla的true ),如果失败,则返回到老化的ActiveXObjectSendRequest 将参数数组作为 key-value-pairs ( 即: {"key1","value1","宋体","value2"。 } 等),将参数准备为要发送的字符串,并使用HTTP_POST将它的异步发送到调用它的页( 请记住: 我们的控件处理它自己的AJAX请求,这就是为什么发送请求的URI是包含我们控件的页面的URI。

嵌入你的脚本

我最头痛的部分是如何将脚本嵌入到我的dll中,并从那里使用它。 结果是,如果你知道怎么做,那并不是那么难。 这是四个步骤:

  • 为项目创建资源文件( right-click项目,Properties-> 资源)
  • 将 。js文件添加到资源中
  • 将 文件的生成属性设置为"嵌入式资源": right-click js文件( 通常放在子文件夹中"资源"),, 还有你
  • assemby:webresource 属性设置为:
[assembly: WebResource("ProjectName.Resources.Filename.js", "text/javascript")]

这里属性直接插入基类文件中的命名空间声明之上。

尝试避免JavaScript文件名中的任何点。 相信我,这可以节省你几年的时间 expectance。

一旦嵌入了脚本,你就可以将它注册到你的控件所在的ASP页面。 使用上面的属性中所使用的确切名称进行这里操作;例如在调用该属性之后,我将在重写的OnInit 方法中注册基本的AJAX base.OnInit :

Page.ClientScript.RegisterClientScriptResource(typeof(AjaxControl), 
 "AbstractAjaxControl.Resources.AjaxBase.js");

你可以在你的控制代码中的任意一点注册。

演示控件

因为如果尝试实例化一个抽象类( 这就是为什么它是抽象的),你会感到失望,我将一个从 AJAXControl 派生出来的类,向你展示如何做到这一点。 非常简单

  • 添加 new 类
  • AJAXControl 导出
  • 实现该控件,如同编写一个普通的ASP.NET 控件( 即: 请注意 RenderContents() 方法,如果你更像我,则使用 CreateChildControls() 方法
  • 实现继承的HandleAjaxRequest() 方法( 并确保它调用 Response.End(),我们不希望对页面进行更多的处理)
  • 编写一个JavaScript方法来处理一个 XmlHttpResponse,一个用于准备和调用 SendRequest()
  • 如果愿意,将JavaScript嵌入到DLL中。 你不必这样尽管。

完成。

yf_terminology_Points of interest@#@#@#兴趣点_yf_terminology

它是 true,这种方法比使用 ASP.NET AJAX扩展要努力得多。 另一方面,它是 LESS 开销的,你可以完全控制页面执行的操作,而不需要。 而且有些环境下没有安装 ASP.NET AJAX,安装也没有任何选择。 这就是我在第一部分手工完成整个AJAX任务的原因。

如果可以,尝试使用你的javascript嵌入资源。 不再维护不断增长的JavaScript文件夹。

历史记录

  • 第一个版本,没有历史记录: 07/07/27.


文章标签:控制  USE  用户  用户控制  

Copyright © 2011 HelpLib All rights reserved.    知识分享协议 京ICP备05059198号-3  |  如果智培  |  酷兔英语