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 showModalDialog 多层模态窗口实现页面提交及刷新的代码
Nov 28 Javascript
TextArea不支持maxlength的解决办法(jquery)
Sep 13 Javascript
jquery插件validate验证的小例子
May 08 Javascript
Js冒泡事件详解及阻止示例
Mar 21 Javascript
javascript跨域原因以及解决方案分享
Apr 08 Javascript
js实现交换运动效果的方法
Apr 10 Javascript
Node.js 应用跑得更快 10 个技巧
Apr 03 Javascript
JS点击某个图标或按钮弹出文件选择框的实现代码
Sep 27 Javascript
浅析location.href跨窗口调用函数
Nov 22 Javascript
微信小程序中hidden不生效原因的解决办法
Apr 26 Javascript
vue2里面ref的具体使用方法
Oct 27 Javascript
详解JSON Web Token 入门教程
Jul 30 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
解决文件名解压后乱码的问题 将文件名进行转码的代码
2012/01/10 PHP
浅谈PHP强制类型转换,慎用!
2013/06/06 PHP
CentOS 6.3下安装PHP xcache扩展模块笔记
2014/09/10 PHP
jquery select(列表)的操作(取值/赋值)
2011/03/16 Javascript
JQuery分别取得每行最后一列和最后一行的示例代码
2013/08/18 Javascript
Jquery通过Ajax访问XML数据的小例子
2013/11/18 Javascript
Javascript限制网页只能在微信内置浏览器中访问
2014/11/09 Javascript
JS实现漂亮的淡蓝色滑动门效果代码
2015/09/23 Javascript
利用jQuery和CSS将背景图片拉伸
2015/10/16 Javascript
详解Node.js模块间共享数据库连接的方法
2016/05/24 Javascript
基于JavaScript FileReader上传图片显示本地链接
2016/05/27 Javascript
从零学习node.js之搭建http服务器(二)
2017/02/21 Javascript
Angular 2父子组件数据传递之@Input和@Output详解 (上)
2017/07/05 Javascript
vue组件实践之可搜索下拉框功能
2018/11/25 Javascript
nodejs中request库使用HTTPS代理的方法
2019/04/30 NodeJs
通过实例解析vuejs如何实现调试代码
2020/07/16 Javascript
Vue项目中使用mock.js的完整步骤
2021/01/12 Vue.js
在Python中操作文件之read()方法的使用教程
2015/05/24 Python
浅谈Python数据类型之间的转换
2016/06/08 Python
python引入不同文件夹下的自定义模块方法
2018/10/27 Python
pycharm 实现显示project 选项卡的方法
2019/01/17 Python
Python合并2个字典成1个新字典的方法(9种)
2019/12/19 Python
python操作gitlab API过程解析
2019/12/27 Python
将matplotlib绘图嵌入pyqt的方法示例
2020/01/08 Python
详解torch.Tensor的4种乘法
2020/09/03 Python
DRF使用simple JWT身份验证的实现
2021/01/14 Python
推荐一些比较有用的css3新属性
2014/11/11 HTML / CSS
教导主任竞聘演讲稿
2014/05/16 职场文书
班级学雷锋活动总结
2014/06/26 职场文书
2014年党支部工作总结
2014/11/13 职场文书
营业用房租赁协议书
2014/11/26 职场文书
2015元旦节寄语
2014/12/08 职场文书
铁人纪念馆观后感
2015/06/16 职场文书
2016年学校“3.12”植树节活动总结
2016/03/16 职场文书
2016年感恩教师节活动总结
2016/04/01 职场文书
解决golang结构体tag编译错误的问题
2021/05/02 Golang