现在位置首页 / 前端开发 /正文

Jquery ajax传递对象(数组)到后台并解析的实现

作者: IT小兵 | 2013年12月25日| 热度:℃ | 评论: |参与:

今天在项目中,实现一个工作经历列表功能,动态添加,数据需要传递到后台

这里考虑到用户体验:该界面交互较多,多次添加和删除都是用js实现的。

所以,最后传递数据到后台,我也是采用了jquery的ajax方法,读取js的缓存数据(array),传递到ashx中。

这里有个问题就是:jquery传递对象/数组,无法传递,并且服务端无法获取数据。

google了一下有一些解决方案:

参考资料

再谈Jquery Ajax方法传递到action - 一只博客 - 51CTO技术博客


http://cnn237111.blog.51cto.com/2359144/984466

ajax传递给后台数组参数方式 - lingxyd_0的专栏 - 博客频道 - CSDN.NET


http://blog.csdn.net/lingxyd_0/article/details/10428785


完整解决方案:

1、js对象创建:因为需要把对象json序列化后,才能传递到后台,后台根据json字符串进行反序列化。

所以要求,在js中创建一个对象,与后台C#的实体对象一致。

function WorkEx(depart, title, begintime, endtime) {
    this.SuId = 0;
    this.Id = 0;
    this.DepartmentName = depart;
    this.Title = title;
    this.BeginTime = begintime;
    this.EndTime = endtime;
    this.Description = "";
    this.Enable = 0;
    return this;
}

WorkEx对象,与C#对象完全一致。

2、Jquery   $.ajax方法的配置

针对$.ajax方法的配置参数需要进行修改:

1)dataType: "json", traditional:true:数据类型必须是json。默认的话,traditional为false,即jquery会深度序列化参数对象,以适应如PHP和Ruby on Rails框架,
但servelt api无法处理,我们可以通过设置traditional 为true阻止深度序列化

2)这个是重点!需要把js对象进行json序列化,不然无法传递到服务端。

        data: {  Wl: JSON.stringify(WorkList) }

3)完整代码:

  var AjaxUrl = "../../Service/sp.ashx";
  $.ajax({ 
        type: "post",
        dataType: "json", traditional:true,
        data: { Wl: JSON.stringify(WorkList) },
        url: AjaxUrl,
        success: function (data, textStatus) {
            if (data != null) {
                 
                if (data) {
                    alert("添加成功,系统将会跳转到详情界面。");
                    window.location.href = "SuspectList.html";
                }
                else { 
                    $("#btnAdd").attr("disabled", false); $("#btnAdd").text("再次提交");
                }
            }
        },
        complete: function (XMLHttpRequest, textStatus) {
        },
        error: function (e) {
             
            $("#btnAdd").attr("disabled", false); $("#btnAdd").text("再次尝试提交");
        }
    });

3、在服务器端进行反序列化:

1) 获取到post过来的数据: string worklist = CustomResponse.GetResponse("Wl");

2)反序列化:

   

 List<SuspectWorkExperience> listwork = new List<SuspectWorkExperience>();
listwork = Newtonsoft.Json.JsonConvert.DeserializeObject<List<SuspectWorkExperience>>(worklist);

 Newtonsoft.Json.JsonConvert是一个微软的免费json转换工具。 

Newtonsoft.Json 是.NET 下开源的json格式序列号和反序列化的类库.

使用方法比较简单
1.首先下载你需要的版本,然后在应用程序中引用Newtonsoft.Json.dll 文件.
Newtonsoft.Json <wbr>使用 <wbr>C#序列号json,反序列化对象

2.引用命名空间

Newtonsoft.Json <wbr>使用 <wbr>C#序列号json,反序列化对象


这样就可以直接转换成后台的实体了。


转发注明:IT分享 http://www.suchso.com  

点击阅读本文所属分类的更多文章: 前端开发 。和高手一起交流:346717337
友荐云推荐

未注明转发、原文均为本站原创。分享本文请注明 原文链接

给您更多信息和帮助

在这里您可以找到更多:

技术交流群:346717337 Jquery插件交流

投稿:suchso@vip.qq.com

承接:企业网站门户/微网站/微商城/CMS系统/微信公众号运营/业务咨询

抢天猫双11红包
推荐使用阿里云服务器
echarts教程系列
本月最热文章

微信扫一扫,徜徉悠嘻网,您的休闲乐园

微信公众号:快乐每一天

随机文章
标签

技术交流群:346717337

投稿:suchso@vip.qq.com

专业专注:企业网站门户/微网站/微商城/CMS系统/微信公众号运营/付费问题咨询