本次使用 Ajax.dll,AjaxPro.dll 两个类库
1.首先添加引用:Ajax.dll,AjaxPro.dll 文件在 Libiary 目录下
2.配置 WebConfig 属性
将 下面2行 放在 httpHandlers 节点里面, 如下
<add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax"/>
<add verb="*" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro"/>
例如:
<httpHandlers>
<remove verb="*" path="*.asmx"/>
<add verb="*" path="*.asmx" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
<add verb="*" path="*_AppService.axd" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
<add verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" validate="false"/>
<-- 这两行 注册类库使用, 标记 相关文件的解析 !-->
<add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax"/>
<add verb="*" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro"/>
</httpHandlers>
3.为页面使用做准备, *.aspx.cs 文件 里做 注册
AddUser 是 网页的名称, 也就是类名
Ajax.Utility.RegisterTypeForAjax(typeof(AddUser));
此声明 一定要在 IsPostBack 前面, 因为每一次页面刷新 都需要,
所以一般放在 Page_Load 事件的第一句话
例如:
public partial class AddUser : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
//表示当前 注册 可以调用 ajax 的类 AddUser
Ajax.Utility.RegisterTypeForAjax(typeof(AddUser));
if (!IsPostBack)
{
}
}
}
4. 标记 要使用Ajax 调用 的方法
允许ajax 的 调用的 类, 必须是 public ,而且需要 做 声明标记
[Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
例如:
[Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
public int addCategory_click(string cateName, string empId)
{
try
{
//根据输入的 参数 不同, 模拟返回 一个随机数表示 自增列的Id
int categoryId = cateName.Length+empId.Length;
if (categoryId==2)
{
//如果输入的是 用户名和密码长度 等于2, 即返回0,
//说明 进入到了 本方法
return 0;
}
//返回随机数 1到 categoryId 的长度, 结果大于0
categoryId = new Random().Next(1, categoryId);
return categoryId;
}
catch
{
return 0;
}
}
5.页面上的使用
先引入 jquery,当然是为了下面操作使用 btn_add_click 方法:
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
function btn_add_click() {
var loginname = $("#txt_loginname").val();
var pwd = $("#txt_pwd").val();
// 这里可以传入多个参数 或者 不传参数
// 调用方式: 当前 类名.方法名
AddUser.addCategory_click(loginname, pwd, function (data) {
var cateId = parseInt(data.value); //返回 int类型
// alert(cateId);
if (cateId == 0) {
//跳转
alert("输入2位");
} else {
alert("添加成功");
}
});
}
网页Body部分
<body>
<form id="form1" runat="server">
<div style=" width:500px; border:1px solid pink; margin:0 auto;">
<table>
<tr><td>用户名:</td><td> <input type="text" id="txt_loginname" value="" /></td></tr>
<tr><td>密码:</td><td><input type="password" id="txt_pwd" value="" /></td></tr>
<tr><td colspan="2"><input type="button" value="添加" onclick="btn_add_click();" name="btn_add" id="btn_add" /></td></tr>
</table>
</div>
</form>
</body>
接下来是 发放源代码: 源代码下载
