通过jquery的serializearray处理表单数据成json格式,并提交到后台处理

简介:

var params = $("#myform").serializeArray();
var values = {};
for (var item in params) {
   values[params[item].name] = params[item].value;
}
alert(JSON.stringify(values));

完整代码

$("#myform").mvalidate({
    type:1,
    onKeyup:true,
    sendForm:true,
    firstInvalidFocus:true,
    valid:function(event,options){
        event.preventDefault();
        //点击提交按钮时,表单通过验证触发函数
        var params = $("#myform").serializeArray();
        var values = {};
        for (var item in params) {
            values[params[item].name] = params[item].value;
        }

        // 传递到后台
        var user = $api.getStorage('user');
        values.member_id = user.member_id;

        api.ajax({
            url: BASE_SH_REQUEST_URL+'/?g=Api&m=Address&a=addAddress',
            method: 'post',
            data: {
                values: values,
            }
        }, function(json, err) {
            if (json.status == '1') {
                // 添加成功
                alert(JSON.stringify(json.info));
            } else {
                var toast = new auiToast();
                toast.fail({
                    title:json.msg,
                    duration:2000
                });
            }
        });
    },
    descriptions:{
        default:{
            required : '必填字段'
        },
        name:{
            required : '请输入收货人姓名'
        },
        tel : {
            required : '请输入手机号码',
            pattern : '手机号格式不正确'
        },
        seachprov : {
            required : '请选择省、直辖市'
        },
        seachcity : {
            required : '请选择市、直辖区'
        },
        seachdistrict: {
            required : '请选择区/县'
        },
        detail : {
            required : '详情不能为空'
        }
    }
});


本文转自TBHacker博客园博客,原文链接:http://www.cnblogs.com/jiqing9006/p/6030897.html,如需转载请自行联系原作者

相关文章
|
2月前
|
移动开发 JSON 数据可视化
精选八款包括可视化CMS,jquery可视化表单,vue可视化拖拉,react可视化源码
精选八款包括可视化CMS,jquery可视化表单,vue可视化拖拉,react可视化源码
60 0
|
4月前
|
存储 JSON 前端开发
jQuery Get 请求参数转换为 JSON
【8月更文挑战第22天】
|
4月前
|
前端开发 JavaScript Java
SpringBoot+JQuery+Ajax实现表单数据传输和单文件或多文件的上传
关于如何在SpringBoot项目中结合JQuery和Ajax实现表单数据的传输以及单文件或多文件上传的教程。文章提供了完整的前后端示例代码,包括项目的`pom.xml`依赖配置、SpringBoot的启动类`App.java`、静态资源配置`ResourceConfig.java`、配置文件`application.yml`、前端HTML页面(单文件上传和多文件上传加表单内容)以及后端控制器`UserController.java`。文章最后展示了运行结果的截图。
256 0
SpringBoot+JQuery+Ajax实现表单数据传输和单文件或多文件的上传
|
4月前
|
Devops 持续交付 测试技术
JSF遇上DevOps:开发流程将迎巨变?一篇文章带你领略高效协同的魅力!
【8月更文挑战第31天】本文探讨了如何在JavaServer Faces(JSF)开发中融入DevOps文化,通过持续集成与部署、自动化测试、监控与日志记录及反馈机制,提升软件交付速度与质量。文中详细介绍了使用Jenkins进行自动化部署、JUnit与Selenium进行自动化测试、ELK Stack进行日志监控的具体方法,并强调了持续改进的重要性。
44 0
|
4月前
|
XML JSON 前端开发
AJAX是什么?原生语法格式?jQuery提供分装好的AJAX有什么区别?
AJAX是什么?原生语法格式?jQuery提供分装好的AJAX有什么区别?
35 0
|
4月前
|
JSON JavaScript 数据格式
html jquery from 表单提交 application/x-www-form-urlencoded 改成 json
html jquery from 表单提交 application/x-www-form-urlencoded 改成 json
48 0
|
4月前
|
JSON JavaScript 数据格式
Jquery 将 JSON 列表的 某个属性值,添加到数组中,并判断一个值,在不在数据中
Jquery 将 JSON 列表的 某个属性值,添加到数组中,并判断一个值,在不在数据中
84 0
|
6月前
|
JSON JavaScript 前端开发
jQuery获取json文件的方法
jQuery获取json文件的方法
55 2
|
7月前
|
JSON 前端开发 JavaScript
jQuery ajax读取本地json文件 三级联动下拉框
jQuery ajax读取本地json文件 三级联动下拉框