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 Array对象基础知识小结
Nov 16 Javascript
js猜数字小游戏的简单实现代码
Jul 02 Javascript
javascript 面向对象封装与继承
Nov 27 Javascript
jQuery控制网页打印指定区域的方法
Apr 07 Javascript
jQuery插件Tmpl的简单使用方法
Apr 27 Javascript
js实现头像图片切割缩放及无刷新上传图片的方法
Jul 17 Javascript
JS组件Bootstrap Table使用方法详解
Feb 02 Javascript
如何使用JS在HTML中自定义字符串格式化
Jul 20 Javascript
javascript实现自由编辑图片代码详解
Jun 21 Javascript
深入浅析ng-bootstrap 组件集中 tabset 组件的实现分析
Jul 19 Javascript
使用Angular material主题定义自己的组件库的配色体系
Sep 04 Javascript
vue中v-for循环选中点击的元素并对该元素添加样式操作
Jul 17 Javascript
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
yii2中结合gridview如何使用modal弹窗实例代码详解
2016/06/12 PHP
PHP实现基本留言板功能原理与步骤详解
2020/03/26 PHP
JQuery 常用方法基础教程
2009/02/06 Javascript
JavaScript 对话框和状态栏使用说明
2009/10/25 Javascript
Javascript中获取出错代码所在文件及行数的代码
2010/09/23 Javascript
ExtJS4 组件化编程,动态加载,面向对象,Direct
2011/05/12 Javascript
JS中Date日期函数中的参数使用介绍
2014/01/02 Javascript
javascript操纵OGNL标签示例代码
2014/06/16 Javascript
JS根据年月获得当月天数的实现代码
2014/07/03 Javascript
使用Sticker.js实现贴纸效果
2015/01/28 Javascript
jquery插件star-rating.js实现星级评分特效
2015/04/15 Javascript
JS实现点击按钮后框架内载入不同网页的方法
2015/05/05 Javascript
jQuery实现图片与文字描述左右滑动自动切换的方法
2015/07/27 Javascript
JS基于myFocus库实现各种功能的tab选项卡切换效果
2015/09/19 Javascript
js实现手机拍照上传功能
2017/01/17 Javascript
详解ionic本地相册、拍照、裁剪、上传(单图完全版)
2017/10/10 Javascript
jquery ajaxfileupload异步上传插件
2017/11/21 jQuery
vue组件实现弹出框点击显示隐藏效果
2020/10/26 Javascript
小程序实现列表点赞功能
2018/11/02 Javascript
JointJS流程图的绘制方法
2018/12/03 Javascript
优雅地使用loading(推荐)
2019/04/20 Javascript
jQuery实现朋友圈查看图片
2020/09/11 jQuery
[01:14:41]DOTA2-DPC中国联赛定级赛 iG vs Magma BO3第一场 1月8日
2021/03/11 DOTA
python循环监控远程端口的方法
2015/03/14 Python
基于Python中单例模式的几种实现方式及优化详解
2018/01/09 Python
Python3.4 splinter(模拟填写表单)使用方法
2018/10/13 Python
python3的输入方式及多组输入方法
2018/10/17 Python
Python延迟绑定问题原理及解决方案
2020/08/04 Python
Python 实现PS滤镜的旋涡特效
2020/12/03 Python
html5 localStorage本地存储_动力节点Java学院整理
2017/07/06 HTML / CSS
丝芙兰意大利官方网站:Sephora.it
2019/12/13 全球购物
自动化专业个人求职信范文
2013/12/30 职场文书
机械设计毕业生自荐信
2014/02/02 职场文书
小学感恩节活动策划方案
2014/10/06 职场文书
结婚喜宴祝酒词
2015/08/10 职场文书
聊聊redis-dump工具安装问题
2022/01/18 Redis