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读取ASP设定的COOKIE
Feb 15 Javascript
让人蛋疼的JavaScript语法特性
Sep 30 Javascript
jquery实现漫天雪花飞舞的圣诞祝福雪花效果代码分享
Aug 20 Javascript
jQuery实现扑克正反面翻牌效果
Mar 10 Javascript
微信小程序 http请求的session管理
Jun 07 Javascript
微信小程序实现点击按钮修改view标签背景颜色功能示例【附demo源码下载】
Dec 06 Javascript
vue-cli脚手架引入图片的几种方法总结
Mar 13 Javascript
Javascript读写cookie的实例源码
Mar 16 Javascript
微信网页登录逻辑与实现方法
Apr 29 Javascript
详解JavaScript 中的批处理和缓存
Nov 19 Javascript
Vue 打包后相对路径的引用问题
Jun 05 Vue.js
JS前端使用canvas实现物体的点选示例
Aug 05 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
德劲1107的电路分析与打磨
2021/03/02 无线电
PHP实现检测客户端是否使用代理服务器及其匿名级别
2015/01/07 PHP
php获取发送给用户的header信息的方法
2015/03/16 PHP
thinkPHP+PHPExcel实现读取文件日期的方法(含时分秒)
2016/07/07 PHP
Docker搭建自己的PHP开发环境
2018/02/24 PHP
jquery 新手学习常见问题解决方法
2010/04/18 Javascript
javascript中的nextSibling使用陷(da)阱(keng)
2014/05/05 Javascript
javascript中数组array及string的方法总结
2014/11/28 Javascript
jQuery垂直多级导航菜单代码分享
2015/08/18 Javascript
JS刷新父窗口的几种方式小结(推荐)
2016/11/09 Javascript
利用vue.js插入dom节点的方法
2017/03/15 Javascript
基于nodejs 的多页面爬虫实例代码
2017/05/31 NodeJs
Vue2.0中集成UEditor富文本编辑器的方法
2018/03/03 Javascript
解决Angular2 router.navigate刷新页面的问题
2018/08/31 Javascript
微信小程序webview 脚手架使用详解
2019/07/22 Javascript
微信小程序 弹窗输入组件的实现解析
2019/08/12 Javascript
webpack3升级到webpack4遇到问题总结
2019/09/30 Javascript
vue基于v-charts封装双向条形图的实现代码
2019/12/09 Javascript
浅谈Python的异常处理
2016/06/19 Python
解决Spyder中图片显示太小的问题
2018/04/27 Python
python中virtualenvwrapper安装与使用
2018/05/20 Python
python bmp转换为jpg 并删除原图的方法
2018/10/25 Python
Python字符串逆序的实现方法【一题多解】
2019/02/18 Python
python爬虫基础教程:requests库(二)代码实例
2019/04/09 Python
Python OpenCV 调用摄像头并截图保存功能的实现代码
2019/07/02 Python
Python 随机生成测试数据的模块:faker基本使用方法详解
2020/04/09 Python
详解移动端html5页面长按实现高亮全选文本内容的兼容解决方案
2016/12/03 HTML / CSS
How to spawning asynchronous work in J2EE
2016/08/29 面试题
写给女朋友的道歉信
2014/01/12 职场文书
社区党员公开承诺书
2014/08/30 职场文书
国庆节演讲稿范文2014
2014/09/19 职场文书
国庆横幅标语
2014/10/08 职场文书
教师见习报告范文
2014/11/03 职场文书
银行自荐信怎么写
2015/03/05 职场文书
小学学习委员竞选稿
2015/11/20 职场文书
交通安全教育心得体会
2016/01/15 职场文书