AjaxPro and Jquery
以前项目中AjaxPro用的很多。未来项目中会使用到Jquery优化界面友好性。
两者配合就至关重要了。
参考了网上的资料，来源标注在文章末尾了。
下面代码中不同颜色标示出对应关系，没有再做文字说明。
WebConfig 配置
<configuration>
<location path="ajaxpro">
<system.web>
<httpHandlers>
<add verb="*" path="*.ashx" type="AjaxPro.AjaxHandlerFactory,AjaxPro.2"/>
</httpHandlers>
</system.web>
</location>
</configuration>
HTML：
<div>
<asp:TextBox ID="tbReturnValue" runat="server" Width="232px"></asp:TextBox><br />
<input id="btnGetValue" type="button" value="获取数据" Width="237px" style="width: 238px" />
<input id="serverUrl" runat="server" type="hidden" />
</div>
JS：
<script src=jquery-1.2.3.min.js type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#btnGetValue").click(function(){
$.ajax({
type: "POST",
url: $("#serverUrl").val(),//此#serverUrl从Server端赋值
data: '{"name":"Jack"}',
beforeSend:function(xhr) {
xhr.setRequestHeader("X-AjaxPro-Method", "GetData");//GetData为Server端公开函数
},
success: function(response) {
var v=null;
eval("v = " + response + ";");
alert(v.value);
/*
//传递数组的例子
$.each(v.value, function(i, n){
alert( "Value: " + i + ", Name: " + n );
});*/
}
});
});
})
</script>
CS:
namespace MyAjaxPro
{
protected void Page_Load(object sender, EventArgs e)
{
//注册AjaxPro(这里不用注册,若不是用Jquery.ajax方式调用则必须注册)
//AjaxPro.Utility.RegisterTypeForAjax(typeof(Default));
if (!IsPostBack)
{
string path = "/ajaxpro/MyAjaxPro.Default,"; //后台可调用公开类名
path += typeof(Default).Assembly.FullName.Split(',')[0];
path += ".ashx";//
this.serverUrl.Value = path;//这个serverUrl会被JQuery.Ajax调用
}
}
[AjaxPro.AjaxMethod]
public static string GetData(string name) //供JQuery端调用
{
return "Hello " + name;
/*
//一下是传递数组时的例子
string[] strArray = { "",""};
strArray[0] = "Hello";
strArray[1] = name;
return strArray;
*/
}
}
此处采用的是通过Jquery.ajax方法，当然也可以在PageLoad中预先注册，使用JavaScript方法，同时存在的话，经测试未发现问题
1、AjaxPro.Utility.RegisterTypeForAjax(typeof(Default));//PageLoad中2、function btnGetValue1_onclick() {
var ss = MyAjaxPro.Default.GetData("ddd").value; //NameSpace + 类名 +函数名
alert(ss);
}
3、<input id="btnGetValue1" type="button" value="获取数据" Width="237px" style="width: 238px" onclick="return btnGetValue1_onclick()" />
参考http://docs.jquery.com/Tutorials:Using_AjaxPro
http://hi.baidu.com/%C8%FD%C3%F7%D6%CE001/blog/item/bf76b00816f8e185d1581b39.html
http://hi.baidu.com/czh0221/blog/item/0f2ca44545888921cefca375.html
http://www.cnblogs.com/sxlfybb/archive/2009/06/04/1495995.html
http://www.cnblogs.com/xyicheng/archive/2008/12/22/1359971.html