[url=http://extjs.org.cn/files/vswd-ext_2.0.2.zip]这里[/url]可以下载，这个文件可以实现vs2008对于extjs库的智能提示，方便编程（不过我没找到针对3.0版的，如果哪位朋友找到了麻烦发一份给我）。我们先来看下extjs中实现和服务器端通信的一个函数Ext.Ajax.request，该函数接受一个json对象作为参数，该对象有几个常用的属性:
url:字符串类型，指明请求的地址
params:请求时传递给服务器段的参数，可以是对象，字符串
method:请求的方法，字符串类型，“GET"或者"POST"，注意必须是大写的
success:函数类型，请求成功后会执行的函数，该函数有一个参数，是一个包含服务器端响应数据的XMLHttpRequest 对象
failure:函数类型，请求失败后会执行的函数，该函数有一个参数，是一个包含服务器端响应数据的XMLHttpRequest 对象
callback:函数类型，无论请求的结果如何都会执行
好，我们就具体来看看extjs是如何实现和服务器端的交互吧。先把我们的hello.htm页面做如下改动：
[url=extjs/resources/css/ext-all.css]<script type="text/javascript" src="extjs/ext-base-debug.js"></script>
<script type="text/javascript" src="extjs/ext-all-debug.js"></script>
<script type="text/javascript" src="extjs/ext-lang-zh_CN.js"></script>
<script type="text/javascript" src="js/daben.js"></script>
</head>
<body>
<input type="text" id="txt" /><input type="button" id="btn" value="提交" />
<div id="div"></div>
</body>
</html>
然后是更改我们的daben.js文件了，改动之后的代码如下：
///<reference path="vswd-ext_2.0.2.js" />
/**//*
*作者：大笨
*日期：2009-10-10
*版本：1.0
*/
Ext.onReady(function() {
//Ext.MessageBox.alert("信息","Hello world");
/**//*Ext.MessageBox.confirm("comfirm","模拟js的comfirm对话框",function(btn){
alert("点击了"+btn+"按钮");
});*/
Ext.get("btn").on("click", function() {
var data = Ext.fly("txt").getValue();
if (data == "") {
Ext.Msg.alert("警告", "请输入字符串");
}
else {
Ext.Ajax.request({
url: "hello.aspx",
params: { data: data },
method: "POST",
success: function(response) {
Ext.fly("div").update(response.responseText);
},
failure: function(response) {
Ext.Msg.alert("错误", "请求失败，错误代码为：" + response.status);
}
});
}
});
});
我们来简单分析下这个文件：第一行是为了使用vs的智能提示，注意把路径写对，而且必须要加在第一行。Ext.onReady已经介绍过了，Ext.fly是Ext.Element.fly的简写，该方法可以根据id获得Element对象，Element类是Ext中一个非常重要的类，它对Dom进行了封装，增加了一些操作以方便使用，并且兼容主流浏览器。getValue是Element类的方法，获得元素的值，比较郁闷的是没有相应的setValue方法，所以在后边使用了update方法来更新元素的值。在向服务器端传值之前进行客户端的验证是一个良好的编程习惯，这里只是简单进行了字符串不为空的验证，然后就使用了前边说到的Ext.Ajax.request方法了，使用这个方法向页面hello.aspx以post方式发送了数据，我们这里是以json对象的形式发送的，也可以写成字符串形式，对于成功的响应，把响应的文本显示在div中，对于失败的响应，弹出一个对话框并且给出了错误码。
接下来要进行服务器端的编程了。服务器端可以通过两种方式接受客户端传递过来的数据并且作出响应：使用aspx页面和web服务。我们先介绍如何使用aspx页来进行处理。在项目中增加一个页面Hello.aspx，把页面中除了第一行的页面处理指令部分<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Hello.aspx.cs" Inherits="ExtjsDemo.hello" %>全部删去。按下F7切换到代码页，开始编写后台的代码。我们首先通过Request.Params["data"]来获取前台传递过来的数据，同样，在对数据进行处理之前我们先进行数据的有效性验证，这里只是简单判断了是否为空或者空字符串，然后我们就将处理后的结果用Response.Write方法发送给客户端。后台代码如下：
using System;
/**//*
*作者：大笨
*日期：2009-10-10
*版本：1.0
*/
namespace ExtjsDemo
{
public partial class Hello : System.Web.UI.Page
{
页面加载#region 页面加载
/**//// <summary>
/// 页面加载
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void Page_Load(object sender, EventArgs e)
{
string data = Request.Params["data"];
if(!string.IsNullOrEmpty(data))
{
Response.Write(data.ToUpper());
}
}
#endregion
}
}
运行后在编辑框输入字符串，可以看到在下边的div里边以大写的形式显示了出来，通过FF的Firebug我们可以看到数据的交互。
除了使用aspx页面来接受并处理客户端传递过来的数据，我们还可以使用web服务的方式来进行。在项目中添加一个web服务，代码如下：
using System;
using System.Web.Services;
/**//*
*作者：大笨
*日期：2009-10-10
*版本：1.0
*/
namespace ExtjsDemo
{
/**//// <summary>
/// HelloService 的摘要说明
/// </summary>
[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 HelloService : System.Web.Services.WebService
{
将传入的字符串改为大写#region 将传入的字符串改为大写
/**//// <summary>
/// 将传入的字符串改为大写
/// </summary>
/// <param name="data">需要转为大写的字符串</param>
/// <returns>大写字符串</returns>
[WebMethod]
public string ToUpper(string data)
{
if(!string.IsNullOrEmpty(data))
return data.ToUpper();
throw new Exception("字符串不能为空！");
}
#endregion
}
}
当然，默认情况下，web服务是以xml格式来传递数据的，我们可以通过Firebug看到。xml很好很强大，不过有时我们只需要更小巧的json就足够了，那么如何让web服务传递的是json格式呢？我们只需要把请求头中的Content-Type设置为application/json并且把参数使用Ext.util.JSON.encode进行编码或者使用jsonData来代替params.
机械节能产品生产企业官网模板...
大气智能家居家具装修装饰类企业通用网站模板...
礼品公司网站模板
宽屏简约大气婚纱摄影影楼模板...
蓝白WAP手机综合医院类整站源码（独立后台）...
