ExtJs学习笔记(5)_Ajax示例

 

ExtJs学习笔记(5)_Ajax示例

ExtJs对于Ajax的使用非常简单，看下面的代码:

 

1.Html页：

 

<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />--> <! DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//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

<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />--> 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(HttpContextcontext)
{
context.Response.ContentType = " text/plain " ;
if (context.Request[ " name " ] != null && context.Request[ " name " ].ToString() != "" )
{
context.Response.Write( " HelloWorld, " + context.Request[ " name " ].ToString() + " ! " );
}
else
{
context.Response.Write( " HelloWorld " );
}
}

public bool IsReusable
{
get
{
return false ;
}
}
}
}

运行效果：

转载请注明来自"菩提树下的杨过"http://www.cnblogs.com/yjmyzz/archive/2008/08/30/1279918.html

 

欢迎加入：http://www.itpob.cn/bbs