asp.net+ajax的Post请求实例
本文实例讲述了asp.net+ajax的Post请求的实现方法。分享给大家供大家参考。具体如下：
//一个ajax的Post请求
functionsubmitInfo(){
$(".warn").hide();//刚提交的时候隐藏错误的信息
vardata=$("#formData").serialize();//将表单的数据通过序列化表单值，创建URL编码文本字符串。形成一个表单元素集合的jQuery对象
$.post("/login/checkLoginInfo",data,function(ajaxObj){//将数据提交到login控制器下的CheckLOginInfo方法。参数是data。 如果请求成功，function就是请求成功时执行的回调函数。ajaxObj是checkLoginInfo方法的返回数据
//回传内容{status:1(success)/0(fail),}
if(ajaxObj.status==0||status==null){//如果返回状态为0或者为null
$(".warn").show();//将错误信息显示出来
}else{
//登陆成功，跳转都制定页面
window.location='/HotelList/Index';
}
},"json");
}
注意这条语句的参数，与回调函数loginFinish与上面条$.Post()请求的区别
$.post("/ajax/UserLogin.ashx",
{"username":username,"password":password},
loginFinish);<htmlxmlns="http://www.w3.org/1999/xhtml">
<headrunat="server">
<title></title>
<linkhref="/css/ui-lightness/jquery-ui-1.8.2.custom.css"rel="stylesheet"type="text/css"/>
<scriptsrc="/js/jquery-1.4.2.js"type="text/javascript"></script>
<scriptsrc="/js/jquery-ui-1.8.2.custom.js"type="text/javascript"></script>
<scripttype="text/javascript">
//向服务器请求当前登录状态，然后切换登录区域的显示
varcheckLogin=function(){
$.post("/ajax/CheckLogin.ashx",function(data){
varstrs=data.split("|");
if(strs[0]=="no"){
//alert("木有登陆");
$("#divLoginArea").show();//如果没有登陆就显示"登陆"
$("#divLoginOutArea").hide();//隐藏"注销"
}
else{
//切换“登录”、“注销”的两个层
$("#divLoginArea").hide();//隐藏"登陆"
$("#divLoginOutArea").show();//显示"注销"
$("#spanUserName").text(strs[1]);//把当前登录用户名显示出来
}
});
}
varloginFinish=function(data){ //这是一个回调函数
if(data=="ok"){
//alert("成功");
$("#divLogin").dialog("close");//登录成功关闭窗口
checkLogin();//登录成功，刷新登录区域的显示
}
else{
alert("用户名密码错误");
}
};
$(function(){
$("#btnShowLoginDlg").click(function(){
$("#divLogin").dialog({
height:200,
modal:true
});
});
$("#btnLogin").click(function(){ //当用户点击"登陆"控件触发事件
//todo:检验用户名、密码不能为空
varusername=$("#txtUserName").val();
varpassword=$("#txtPwd").val();
$.post("/ajax/UserLogin.ashx",//----------------------请关注这条$.Post()请求的参数与回调函数
{"username":username,"password":password},
loginFinish);
});
});
$(function(){
checkLogin();//刚进入页面的时候也是先向服务器查询当前登录状态
$("#btnLogout").click(function(){
$.post("/ajax/Logout.ashx",function(){
checkLogin();//刷新显示
});
});
});
</script>
<asp:ContentPlaceHolderID="head"runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<formid="form1"runat="server">
<div>
<divid="divLoginArea"style="display:none"><inputtype="button"value="登录"id="btnShowLoginDlg"/></div>
<divid="divLoginOutArea"style="display:none">
<spanid="spanUserName"></span>
<inputtype="button"value="注销"id="btnLogout"/>
</div>
<divid="divLogin"title="登录窗口" style="display:none">
<table>
<tr><td>用户名：</td><td><inputtype="text" id="txtUserName"/></td></tr>
<tr><td>密码：</td><td><inputtype="password" id="txtPwd"/></td></tr>
<tr><tdcolspan="2"><inputtype="button"value="登录"id="btnLogin"/></td></tr>
</table>
</div>
<br/>
<asp:ContentPlaceHolderID="placeHolderMain"runat="server">
</asp:ContentPlaceHolder>
<br/>
尾部<br/>
</div>
</form>
</body>
</html>
希望本文所述对大家的asp.net程序设计有所帮助。