您的位置:首页 > Web前端 > JQuery

JQuery+post+asp.net的三种方法

2013-03-27 15:34 363 查看
<head>
<title>无标题页</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="jquery/themes/icon.css" rel="stylesheet" type="text/css" />
<link href="jquery/themes/default/easyui.css" rel="stylesheet" type="text/css" />
<script src="jquery/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="jquery/jquery.easyui.min.js" type="text/javascript"></script>
<script src="jquery/locale/easyui-lang-zh_CN.js" type="text/javascript"></script>
<script language ="javascript" type="text/javascript">
$(function(){
$('#p').dialog({
width:500,
height:150,
title: 'My Panel',
buttons: [{
text:'登录',
//iconCls:'icon-add',
handler:function(){
$.ajax({
type: "POST",
url: "Handler_login.ashx",
dataType: "json",

//方法一:用字符串连接的方式
//data: "name="+$(Text1).val()+"&location="+$(Text2).val(),

//方法二:直接获取input的内容可以用name获取,也可以用id
//data:{
//name : $('#p input[id=Text1]').val(),
//pwd : $('#p input[id=Text2]').val()
//},

//方法三:JQuery的serialize()
//这种方法一定要设置input中name的值,不然传参会出错
//这种方法对于好几个参数的传递非常便捷
data: $("form").serialize(),

success: function(msg){
alert( "Data Saved: " + msg[0].name);
},
error: function (xmlReq, err, c) {
alert("error:" + err);
}
});
}
},{
text:'注册',
//iconCls:'icon-save',
handler:function(){alert('save')}
}]
});

})

</script>
</head>


<div id="p" style="padding:10px;">
<form>
<p><input name="name" id="Text1" type="text" />panel content.</p>
<p><input name="pwd" id="Text2" type="text" />panel content.</p>
</form>
</div>


前两种方法带不带<form>都无所谓,第三种一定要带<form>,另外,我们在JQuery中定义POST了,所以form里写不写method=post也无所谓了

下面文件,我写在ashx中

<%@ WebHandler Language="C#" Class="Handler_login" %>

using System;
using System.Web;
using System.Text;
public class Handler_login : IHttpHandler
{
public string name ="";
public string pwd = "";

public void ProcessRequest (HttpContext context) {
context.Response.ContentType = "text/plain";//无格式正文
if ((context.Request["name"] != null) && (context.Request["pwd"] != null))
{
this.name = context.Request["name"].ToString();
this.pwd = context.Request["pwd"].ToString();

context.Response.ContentType = "application/json;charset=utf-8";
context.Response.Write(ToJson(new string[]{"name@"+name,"pwd@"+pwd}));
//可以增加一个带bool值:context.Response.Write(ToJson(new string[] { "success@" + true, "name@" + name, "pwd@" + pwd }));
}
}

public bool IsReusable {
get {
return false;
}
}

public string ToJson(string[] array)
{
StringBuilder s = new StringBuilder(128);
s.Append("[");
for (int i = 0; i < array.Length; i++)
{
s.Append("{");
s.Append("\"");
s.Append(array[i].Split('@')[0]);
s.Append("\"");
s.Append(":");
s.Append("\"");
s.Append(array[i].Split('@')[1]);
s.Append("\"");
s.Append("}");
if (i != (array.Length-1))
s.Append(",");
}
s.Append("]");
return s.ToString();
}
}


ToJson 是为了生成Json用的,注意下,Json的格式为[{"name":"123"}.{"pwd":"123"}],这里的必须用的双引号,不然JQuery就显示一个错误,收不到服务器端传回的数据.
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: