ExtJs学习笔记_Ajax示例
ExtJs对于Ajax的使用非常简单，看下面的代码:
1.Html页：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head >
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link rel="stylesheet" type="text/css" href="js/ext2.2/resources/css/ext-all.css" />
<script type="text/javascript" src="js/ext2.2/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="js/ext2.2/ext-all.js"></script>
<title></title>
</head>
<body>
<script type="text/javascript">
Ext.onReady(function() {
var fnAjaxDemo = function() {
var mydata;
Ext.Ajax.request({
url: "GetData.ashx?name=" + encodeURIComponent(Ext.get("name").dom.value), //服务器端地址
success: function(request) {
mydata = request.responseText; //服务器端文本数据
Ext.MessageBox.alert("返回值",mydata);
},
failure: function() {
alert("failure!");
}
});
}
Ext.get("btnTest").on("click", fnAjaxDemo);
})
</script>
<input id="name" value="Jimmy" name="name" />
<button id="btnTest">获取服务端信息</button>
</body>
</html>
2.服务端GetData.ashx
using System.Web;
using System.Web.Services;
namespace Ajax_WCF
{
/// <summary>
/// $codebehindclassname$ 的摘要说明
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class GetData : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
if (context.Request["name"] != null && context.Request["name"].ToString()!="")
{
context.Response.Write("Hello World," + context.Request["name"].ToString() + "!");
}
else
{
context.Response.Write("Hello World");
}
}
public bool IsReusable
{
get
{
return false;
}
}
}
}
运行效果：
