jQuery调用Webservice传递json数组的方法


Posted in Javascript onAugust 06, 2016

本文实例讲述了jQuery调用Webservice传递json数组的方法。分享给大家供大家参考,具体如下:

Jquery由于提供的$.ajax强大方法,使得其调用webservice实现异步变得简单起来,可以在页面上传递Json字符串到Webservice中,Webservice方法进行业务处理后,返回Json对象给页面,让页面去展现。

这一切都非常的简单,今天要学习的并非这些。我们在实际处理业务过程中,会发现往往页面要传递给webservice 的并非一个或多个字符串,有时候需要传递的是一个组合数据,如这样的一组数据:

{'Employee': [{'name':'John','sex':'man','age':'25'},{'name':'Tom','sex':'man','age':'21'}]}

客户端将这样的Json字符串作为$.ajax方法的data参数是没有问题的,然而,服务端的webservice该如何去写接收参数却成为了一个问题。在百度、谷歌了一番后,只发现提问的却没有回答的。索性还是自己去研究吧,发现其实Employee对象首先是一个数组,其次数组的每一项都是一个Dictionary<string,string>字典类型。于是我尝试在服务端使用Dictionary<string,string>[] Employee来接收客户端传递的参数,一切如我所料,成功!

客户端代码如下:

//JQuery 调用webService导入数据
function LoadData() {
    var studentData = CollectionData();
    $.ajax({
      url: "ImportDataService.asmx/ImportStu",
      type: "post",
      contentType: "application/json;charset=utf-8",
      dataType: "json",
      data: "{'students':[{'name':'KoBe ','sex':'boy','age':'20'},{'name':'Mary','sex':'girl','age':'19'}]}",
      success: function(result) {
        alert(result.d);
      },
      error: function(e) {
        alert(e.responseText);
      }
    });
}

服务端代码如下:

/// <summary>
///
/// </summary>
/// <param name="students"></param>
/// <returns></returns>
[WebMethod]
[ScriptMethod(ResponseFormat=ResponseFormat.Json)]
public string ImportStu(Dictionary<string,string> []students)
{
  if (students.Length == 0)
  {
    return "没有任何数据!";
  }
  else
  {
    try
    {
      foreach (Dictionary<string, string> stu in students)
      {
        //构造一个新的Student对象。
        Student student = new Student();
        //为新构造的Student对象属性赋值。
        foreach (string key in stu.Keys)
        {
          switch (key)
          {
            case "name":
              student.Name = stu[key];
              break;
            case "sex":
              student.Sex = stu[key];
              break;
            case "age":
              int age;
              if (Int32.TryParse(stu[key], out age))
              {
                student.Age = age;
              }
              else
              {
                student.Age = 0;
              }
              break;
            default:
              break;
          }
        }
      }
      return "导入学生成功!";
    }
    catch
    {
      throw new Exception("导入学生失败!");
    }
  }
}

需要注意的是,服务端参数名需要和客户端Json数组的key值相同,如上代码中,参数名都为students。

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
javascript中获取选中对象的类型
Apr 02 Javascript
通过隐藏option实现select的联动效果
Nov 10 Javascript
JS setCapture 区域外事件捕捉
Mar 18 Javascript
javascript 仿QQ滑动菜单效果代码
Sep 03 Javascript
jquery maxlength使用说明
Sep 09 Javascript
IE下window.onresize 多次调用与死循环bug处理方法介绍
Nov 12 Javascript
利用浏览器全屏api实现js全屏
Jan 16 Javascript
JS对象与json字符串格式转换实例
Oct 28 Javascript
javascript实现简单的二级联动
Mar 19 Javascript
JS获取Table中td值的方法
Mar 19 Javascript
jQuery.cookie.js实现记录最近浏览过的商品功能示例
Jan 23 Javascript
vite+vue3.0+ts+element-plus快速搭建项目的实现
Jun 24 Vue.js
Google 地图API Map()构造器详解
Aug 06 #Javascript
Google 地图API资料整理及详细介绍
Aug 06 #Javascript
jquery自动补齐功能插件flexselect用法示例
Aug 06 #Javascript
Google 地图类型详解及示例代码
Aug 06 #Javascript
Google 地图控件集详解及实例代码
Aug 06 #Javascript
Google 地图事件实例讲解
Aug 06 #Javascript
Google 地图叠加层实例讲解
Aug 06 #Javascript
You might like
php并发加锁示例
2016/10/17 PHP
javascript获取当前ip的代码
2009/05/10 Javascript
jquery.ui.draggable中文文档
2009/11/24 Javascript
JavaScript中几个重要的属性(this、constructor、prototype)介绍
2013/05/19 Javascript
js写一个字符串转成驼峰的实例
2013/06/21 Javascript
Javascript基础教程之数组 array
2015/01/18 Javascript
jQuery实现对无序列表的排序功能(附demo源码下载)
2016/06/25 Javascript
VUE 更好的 ajax 上传处理 axios.js实现代码
2017/05/10 Javascript
详解EasyUi控件中的Datagrid
2017/08/23 Javascript
分享vue.js devtools遇到一系列问题
2017/10/24 Javascript
vue根据进入的路由进行原路返回的方法
2018/09/26 Javascript
深入理解JavaScript 中的执行上下文和执行栈
2018/10/23 Javascript
vue.js指令v-for使用以及下标索引的获取
2019/01/31 Javascript
微信小程序tabBar设置实例解析
2019/11/14 Javascript
JS实现瀑布流效果
2020/03/07 Javascript
从零学python系列之浅谈pickle模块封装和拆封数据对象的方法
2014/05/23 Python
详解Python2.x中对Unicode编码的使用
2015/04/03 Python
详细解析Python当中的数据类型和变量
2015/04/25 Python
Python中文竖排显示的方法
2015/07/28 Python
用Python的Flask框架结合MySQL写一个内存监控程序
2015/11/07 Python
python生成ppt的方法
2018/06/07 Python
pywinauto自动化操作记事本
2019/08/26 Python
Win系统PyQt5安装和使用教程
2019/12/25 Python
Python爬虫实现模拟点击动态页面
2020/03/05 Python
Python要求O(n)复杂度求无序列表中第K的大元素实例
2020/04/02 Python
python实现处理mysql结果输出方式
2020/04/09 Python
毕业生求职找工作的自我评价范文
2013/11/27 职场文书
交通事故协议书范文
2014/04/16 职场文书
业务员自荐信范文
2014/04/20 职场文书
主要负责人任命书
2014/06/06 职场文书
委托代理人授权委托书范本
2014/09/24 职场文书
2014年仓库保管员工作总结
2014/12/03 职场文书
详解nginx进程锁的实现
2021/06/14 Servers
MySQL REVOKE实现删除用户权限
2021/06/18 MySQL
nginx rewrite功能使用场景分析
2022/05/30 Servers
css样式important规则的正确使用方式
2022/06/10 HTML / CSS