首页 > 其他分享 >html jquery from 表单提交 application/x-www-form-urlencoded 改成 json

html jquery from 表单提交 application/x-www-form-urlencoded 改成 json

时间:2023-12-26 18:03:31浏览次数:34  
标签:jquery function www obj form required layer true

html jquery from 表单提交 $(form).ajaxSubmit application/x-www-form-urlencoded 改成 json

<form class="form form-horizontal" id="form-admin-add">
  <div class="row cl">
    <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>管理员:</label>
    <div class="formControls col-xs-8 col-sm-9">
      <input type="text" class="input-text" value="" placeholder="" id="adminName" name="adminName">
    </div>
  </div>
</form>

js

<script type="text/javascript">
$(function(){
    $('.skin-minimal input').iCheck({
        checkboxClass: 'icheckbox-blue',
        radioClass: 'iradio-blue',
        increaseArea: '20%'
    });

    $("#form-admin-add").validate({
        rules:{
            adminName:{
                required:true,
                minlength:4,
                maxlength:16
            },
            password:{
                required:true,
            },
            password2:{
                required:true,
                equalTo: "#password"
            },
            sex:{
                required:true,
            },
            phone:{
                required:true,
                isPhone:true,
            },
            email:{
                required:true,
                email:true,
            },
            adminRole:{
                required:true,
            },
        },
        onkeyup:false,
        focusCleanup:true,
        success:"valid",
        submitHandler:function(form){
            $(form).ajaxSubmit({
                type: 'post',
                url: "xxxxxxx" ,
                success: function(data){
                    layer.msg('添加成功!',{icon:1,time:1000});
                    var index = parent.layer.getFrameIndex(window.name);
                    parent.$('.btn-refresh').click();
                    parent.layer.close(index);
                },
                error: function(XmlHttpRequest, textStatus, errorThrown){
                    layer.msg('error!',{icon:1,time:1000});
                }
            });
        }
    });
});
</script>

改成 JSON
submitHandler:function(form){} 的代码修改如下:

submitHandler:function(form){
  var obj = {};
  obj.id = $("#hidId").val().trim();
  obj.adminName = $("#adminName").val().trim();
  obj.sex = $("input[name='sex']:checked").val();
  obj.phoneNo = $("#phone").val().trim();
  obj.roleList = userRoleList;

  //$(form).ajaxSubmit({ //这个要换掉,不然不起作用
  $.ajax({
    type: 'post',
    url: "xxxxxxx" , 
    dataType: 'json',
    contentType: "application/json;charset=utf-8",
    headers: {
      'AccessToken': 'TokenValue'
    },
    data: JSON.stringify(obj), // 将 JSON 对象转换为 JSON 字符串作为请求数据
    beforeSend: function (XMLHttpRequest) {
      layer.msg("数据提交中....", { icon: 16, time: 60000, shade: 0.1 });
    },    
    success: function(data){
      layer.msg('添加成功!',{icon:1,time:1000});
      var index = parent.layer.getFrameIndex(window.name);
      parent.$('.btn-refresh').click();
      parent.layer.close(index);
    },
    error: function(XmlHttpRequest, textStatus, errorThrown){
      layer.msg('error!',{icon:1,time:1000});
    }
  });
}

作者:VipSoft


标签:jquery,function,www,obj,form,required,layer,true
From: https://blog.51cto.com/u_15116285/8985932

相关文章

  • jQuery功能强大的图片查看器插件 viewer
    http://www.htmleaf.com/jQuery/Image-Effects/201509032517.html 如果想知道用户点击的是第几张图片,可使用HTML5的window.postMessage实现通信,修改viewer.js: 然后在html中接收事件: ......
  • logstash抽取clickhouse数据库偶现网络错误异常并提示FORMAT TabSeparatedWithNamesAn
     如上图错误信息所示,可以看到第一次sql查询是正常的,在第二次offset偏移的时候报了网络错误。起初的想法就是clickhouse的问题,把sql粘贴出来放入clickHouse中单独执行发现sql并无问题。然后又认为是logstash的问题并分别下载了logstash-7.3.1、logstash-7.17.15、logstash-8.11.......
  • MySql的information_schema.processlist库学习之"如何检测出大数据sql查询"
    1.如何通过MySql检测出大数据sql查询一般数据库都会存在:information_schema数据库 检测出大数据sql查询[time时间越长说明,数据量越大,要根据公司的限度来衡量,我的思路是500以上都要查看是否是大数据的范畴]2.案例--检测出大数据sql查询[time时间越长说明,数据量越大,要根据......
  • C# WinForm控件之advTree
    原文链接:https://www.cnblogs.com/SoftWareIe/p/8757270.html0.属性和方法//属性方法advTree1.DragDropEnabled=!advTree1.DragDropEnabled;//控制是否可以拖动节点advTree1.MultiSelect=!advTree1.MultiSelect;//控制节点是否可以多选advTree1.ExpandButtonType=Dev......
  • python网站创建015:jQuery的标签操作
    当我们找到标签之后,就要学习jQuery对这个标签都能做哪些操作? 1、样式操作:也就是操作标签的css样式添加样式:addClass删除样式:removeClass判断是否有该样式:hasClass有则移除,无则添加:toggleClass<!DOCTYPEhtml><html><head><title>初识:JavaScript</title><meta......
  • 自然语言处理的模型:从 Bag of Words 到 Transformer
    1.背景介绍自然语言处理(NLP)是计算机科学与人工智能的一个分支,研究如何让计算机理解、生成和处理人类语言。自然语言处理的主要任务包括文本分类、情感分析、命名实体识别、语义角色标注、语义解析、机器翻译等。随着大数据时代的到来,自然语言处理技术的发展得到了巨大的推动。在过......
  • winforms入门简介
    原文链接:https://upimg.baike.so.com/doc/9995803-10343583.htmlwinforms脚本都是基于c#,winforms是做客户端软件,WinForm是.Net开发平台中对WindowsForm的一种称谓。简单来说:WinForms和ASP.NET的平台支持C#和VB.NET编程语言。WinForms是做客户端软件,ASP.NET是基于网络开发的......
  • kettle从入门到精通 第二十六课 再谈 kettle Transformation executor
     1、前面文章有学习过Transformationexecutor ,但后来测试kettle性能的时候遇到了很大的问题,此步骤的处理性能太慢,导致内存溢出等问题。所以再次一起学习下此步骤的用法。 2、 如下图中rds-sametable-同步逻辑处理使用的是Transformationexecutor步骤,最后Speed列表示处理速......
  • form
    antd的`FormItem`中的`value`属性通常是与表单数据关联的。对于包含按钮和弹出modal的场景,你可能需要使用`getFieldDecorator`来将表单项与`value`关联起来,以便在表单提交时能够获取所选的值。首先,确保你在`FormItem`中使用了`getFieldDecorator`,例如:```jsx<Form.Itemlabel="Yo......
  • python网站创建014:jQuery的引入、选择器和筛选器
    1.下载jQuery之后,那如何使用呢?假如我想操作一个div标签,给这个标签补充文字<!DOCTYPEhtml><html><head><title>初识:JavaScript</title><metacharset="UTF-8"></head><body><!--定义一个无文本的div标签--><div......