Jquery的Ajax的Post传值-格式为Json

最新推荐文章于 2024-04-25 17:53:36 发布

Walter_lee2008

最新推荐文章于 2024-04-25 17:53:36 发布

阅读量6.5k

点赞数 1

分类专栏： HTM5 文章标签： jquery 前端脚本

本文链接：https://blog.csdn.net/zdhlwt2008/article/details/52856990

版权

HTM5 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

1.前端页面包含脚本（ajax）和基本的HTML标记以方便大家对应查找和理解

<script language="javascript">

　　　　function addclick() {                                        //点击触发addclick事件
                var txtuserName = $("#txtuserName").val();//用jquery获取id为txtuserName的页面标记的value，存放在txtuserName变量里
                $.ajax({
                    type: "POST",                                        //ajax的方式为post(get方式对传送数据长度有限制)
                    url: "/AjaxRequest/AddUser.ashx",           //一般处理程序页面AddUser.ashx(在2中会写出该页面内容)
                    dataType: "json",                                   //数据传回的格式为json
                    data: { adduserName: txtuserName},       //要传送的数据键值对adduserName为键（方便2中的文件用此名称接受数据）txtuserName为值（要传递的变量，例如用户名）
                    success: function (data) {                       //成功回传值后触发的方法
                        if (data != null && data.IS != "") {        //如果回传的json不为null或json中的IS键对应的值不为空，则触发一下代码，否则弹出“请重新尝试”
                            if (data.IS == "-1") {                      //如果json中的IS键对应的值为-1，则说明用户名已在数据库中存在
                                alert("添加失败！该名已存在！");
                            }
                            else if (data.IS == "0") {                 //json中的IS键对应的值为0，则说明用户名没有添加成功
                                alert("添加失败!");
                            }
                            else if (data.IS == "-2") {               //json中的IS键对应的值为-2，则说明数据库返回的主键列不能转换成INT32类型
                                alert("数据库连接失败或访问失败!");
                            }
                            else {
                                alert("添加成功！");
                                $("#txtuserName").val("");
                            }
                        }
                        else {
                            alert("请重新尝试！");
                        }
                    }
                })
            }
</script>

<body>

　　<h2>

　　　　<input id="txtuserName" name="" size="26" >

　　</h2>

　　<input type="button" value="提交" οnclick="addclick()"/>

</body>

2.一般处理程序，即接受1中Ajax传来的值并传入BLL层

public void ProcessRequest(HttpContext context)

{

context.Response.ContentType = "text/plain";

int model = new BLL.User().AddUser(context.Request["adduserName"]); //通过context.Request获取1中Ajax里的data：中键值对的键名来得到用户名txtuserName并传入BLL层

context.Response.Write("{\"IS\":\""+model+"\"}"); //拼接json对象（键值对）model为运行存储过程后返回的数字

}

一般处理程序返回json

一般处理程序：

public void ProcessRequest(HttpContext context)

{

string action = context.Request.Params["action"];

switch (action)

{

case "TestAction":

GetJsonString();

break;

}

context.Response.ContentType = "text/plain";

}

public void GetJsonString()

{

Product product = new Product();

product.Name = "Apple";

product.Expiry = new DateTime(2008, 12, 28);

product.Sizes ="Small";

List<Product> list = new List<Product>();

for (int i = 0; i < 12; i++)

{

list.Add(product);

}

HttpContext.Current.Response.Write(JsonConvert.SerializeObject(new { Result = 1, Msg = "获取数据成功", Data = list }));

}

      public class Product
        {
            private string sName;
            private DateTime sExpiry;
            private string sSizes;

            public Product()
            {

            }

            public string Name { get { return sName; } set { sName = value; } }
            public DateTime Expiry { get { return sExpiry; } set { sExpiry = value; } }
            public string Sizes { get { return sSizes; } set { sSizes = value; } }
        }

第一次加载js：

$(function () {

$.ajax({

type: "get",

url: "/action/Handler.ashx",

data: { action: "TestAction" },

dataType: "json",

success: function (data) {

alert(data.Result);

                alert($.isArray( data.Data));
                alert(joResult.Msg);
                alert(joResult.Data[0].Expiry);
                alert(joResult.Data[0].Name);

error: function (XMLHttpRequest, textStatus, errorThrown) {

alert(XMLHttpRequest.status);

alert(XMLHttpRequest.readyState);

alert(textStatus);

}

});

})

Walter_lee2008

关注

1
点赞
踩
5

收藏

觉得还不错? 一键收藏
0
评论
Jquery的Ajax的Post传值-格式为Json

1.前端页面包含脚本（ajax）和基本的HTML标记以方便大家对应查找和理解　　　　function addclick() { //点击触发addclick事件 var txtuserName = $("#txtuserName").val();//用jquery获取i
复制链接

扫一扫