jQuery向webApi提交post json数据


Posted in Javascript onJanuary 16, 2017

在页面想webApi post json数据的时候,发现webapi不能直接以json的方式接受数据(注:我是没有发现一个很好的方式来post json数据的);但是可以以数据结构的方式传递;

如下:

//js代码 
          var d = {
          Id: "1",
          Name: "name",
          Value: "OldValue", 7         };
        $.ajax({
          type: "post",
          url: url1,
          data: JSON.stringify({
            pConfig: d
          }),
          success:function(d){
          }
        });
public class Diff
  {
    public string Id { set; get; }
    public string Name { set; get; }
    public string Value { set; get; }
  }
 public Diff post([FromBody]Diff pConfig)
    {
      List<DiffConfig> s = pConfig;
      return s;
    }

像这样的代码是没有问题的;得到的是一个标准结构的数据;

但是如果改为下面的代码,就会发现没有数据

//js代码 
         var d = [{
           Id: "1",
           Name: "name",
           Value: "Value",
         },{
           Id: "2",
           Name: "name2",
           Value: "Value2",
         }];
         $.ajax({
          type: "post",
          url: url1,
           data: JSON.stringify({
             pConfig: d
          }),
           success:function(d){
         }
        });
public List<Diff> post([FromBody]List<Diff> diff)
     {
       List<Diff> d = diff;
       return d;
     }

这样的代码会发现,数据没有传过来,后面才发现,原来jq的ajax传输数据类型有问题;传输的数据类型contentType的默认值为 "application/x-www-form-urlencoded"。默认值适合大多数情况。但是却不能适应这次传输的值,把   contentType: 'application/json' 设置一下,就可以ok了;数据传输完全没有问题;

$.ajax({
      type: "post",
      dataType: 'json',
      url: url,
      contentType: 'application/json',
      data: JSON.stringify(d),
      success: function (d) {
       
      }
    });

以上所述是小编给大家介绍的jQuery向webApi提交post json数据,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript字符串String和Array操作的有趣方法
Dec 18 Javascript
jquery动态添加删除div 具体实现
Jul 20 Javascript
js如何取消事件冒泡
Sep 23 Javascript
jQuery统计上传文件大小的方法
Jan 24 Javascript
从零学习node.js之详解异步控制工具async(八)
Feb 27 Javascript
xmlplus组件设计系列之按钮(2)
Apr 26 Javascript
vue 运用mock数据的示例代码
Nov 07 Javascript
JS实现移动端触屏拖拽功能
Jul 31 Javascript
微信小程序实现登录注册tab切换效果
Dec 29 Javascript
10行代码实现微信小程序滑动tab切换
Dec 28 Javascript
说说Vue.js中的functional函数化组件的使用
Feb 12 Javascript
Javascript var变量删除原理及实现
Aug 26 Javascript
详解Html a标签中href和onclick用法、区别、优先级别
Jan 16 #Javascript
jQuery插件扩展操作入门示例
Jan 16 #Javascript
jQuery插件版本冲突的处理方法分析
Jan 16 #Javascript
js实现带缓动动画的导航栏效果
Jan 16 #Javascript
jQuery居中元素scrollleft计算方法示例
Jan 16 #Javascript
jQuery使用正则表达式替换dom元素标签用法示例
Jan 16 #Javascript
JavaScript日期选择功能示例
Jan 16 #Javascript
You might like
获得Google PR值的PHP代码
2007/01/28 PHP
php中使用addslashes函数报错问题的解决方法
2013/02/06 PHP
解析在PHP中使用mysqli扩展库对mysql的操作
2013/07/03 PHP
php二分查找二种实现示例
2014/03/12 PHP
PHP中的排序函数sort、asort、rsort、krsort、ksort区别分析
2014/08/18 PHP
javascript hashtable实现代码
2009/10/13 Javascript
extJs 下拉框联动实现代码
2010/04/09 Javascript
javascript一个无懈可击的实例化XMLHttpRequest的方法
2010/10/13 Javascript
JavaScript创建一个欢迎cookie弹出窗实现代码
2013/03/15 Javascript
javaScript面向对象继承方法经典实现
2013/08/20 Javascript
原生js实现电商侧边导航效果
2017/01/19 Javascript
jQuery ajax实现省市县三级联动
2021/03/07 Javascript
ES6 javascript的异步操作实例详解
2017/10/30 Javascript
vue项目中使用Svg的方法
2018/10/24 Javascript
Vue CLI3.0中使用jQuery和Bootstrap的方法
2019/02/28 jQuery
jquery实现简单拖拽效果
2020/07/20 jQuery
[06:48]DOTA2-DPC中国联赛2月26日Recap集锦
2021/03/11 DOTA
解决Python中由于logging模块误用导致的内存泄露
2015/04/23 Python
介绍Python中的文档测试模块
2015/04/28 Python
Python中运算符&quot;==&quot;和&quot;is&quot;的详解
2016/10/08 Python
python实现远程通过网络邮件控制计算机重启或关机
2018/02/22 Python
对python中的pop函数和append函数详解
2018/05/04 Python
Flask框架踩坑之ajax跨域请求实现
2019/02/22 Python
基于python实现音乐播放器代码实例
2020/07/01 Python
Python getattr()函数使用方法代码实例
2020/08/10 Python
Python机器学习工具scikit-learn的使用笔记
2021/01/28 Python
动态密码技术
2012/10/18 面试题
类的返射机制中的包及核心类
2016/09/12 面试题
新闻记者实习自我鉴定
2013/09/19 职场文书
新闻学专业应届生求职信
2013/11/08 职场文书
《梅兰芳学艺》教学反思
2014/02/24 职场文书
安全保证书怎么写
2015/02/28 职场文书
专家推荐信范文
2015/03/26 职场文书
停车场管理制度范本
2015/08/05 职场文书
新党员入党决心书
2015/09/22 职场文书
《揠苗助长》教学反思
2016/02/20 职场文书