沫沫金 - jQuery序列化form表单【支持ajax提交form对象表单entity.xxx】

简介:        需要form表单提交,大表单对字段后台人工处理太麻烦。还是选择form表单对象(entity.xx)提交方便,那么怎么ajax提交这样的form对象表单呢?命名jquery.

       需要form表单提交,大表单对字段后台人工处理太麻烦。还是选择form表单对象(entity.xx)提交方便,那么怎么ajax提交这样的form对象表单呢?


命名jquery.commons.js内容如下

/**
 * FORM对象表单ajax提交前数据处理方法
 * @param frm
 * @returns JSON Object
 */
function getFormJson(frm) {
    var o = {};
    var a = $(frm).serializeArray();
    $.each(a, function () {
        if (o[this.name] !== undefined) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || '');
        } else {
            o[this.name] = this.value || '';
        }
    });
    return o;
}

实例如下

var myForm = getFormJson($("#myform"));
$.ajax({
    url : 'saveAppoint.action',
    type : 'POST',
    data : myForm,
    success : function(data) {
            showMsg(data);
    }
});

form表单内容

<form id="myform">
<input type="hidden" id="timeType" name="appointment.timeType" readonly="readonly" value="<s:property value="appointment.timeType"/>" />
<input type="hidden" id="visitBegin" name="appointment.visitBegin" readonly="readonly" value="<s:property value="appointment.visitBegin"/>" />
<input type="hidden" id="visitEnd" name="appointment.visitEnd" readonly="readonly" value="<s:property value="appointment.visitEnd"/>" />
</form>

action后台

private AppointMent appointment;

public void setAppointment(){...}
public AppointMent getAppointment(){...}


即可实现对象表单提交支持。


以上,谢谢!

作者:沫沫金


目录
相关文章
N..
|
XML JSON 前端开发
jQuery实现Ajax
jQuery实现Ajax
N..
216 1
|
XML 前端开发 JavaScript
jQuery中ajax如何使用
jQuery中ajax如何使用
279 0
|
12月前
|
JavaScript 索引
|
前端开发 JavaScript
杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]
杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]
238 0
杨校老师课堂之基于Servlet整合JQuery中的Ajax进行表单提交[基于IDEA]
|
XML 前端开发 JavaScript
php中Ajax的简单使用,登录表单调用Ajax判断是否正确登录利用layer.msg进行提示
本文介绍了在PHP中如何使用Ajax进行登录表单的数据提交,并利用jQuery的$.post()方法与后端通信,以及使用layer.msg进行前端提示。
php中Ajax的简单使用,登录表单调用Ajax判断是否正确登录利用layer.msg进行提示
|
前端开发 JavaScript Java
SpringBoot+JQuery+Ajax实现表单数据传输和单文件或多文件的上传
关于如何在SpringBoot项目中结合JQuery和Ajax实现表单数据的传输以及单文件或多文件上传的教程。文章提供了完整的前后端示例代码,包括项目的`pom.xml`依赖配置、SpringBoot的启动类`App.java`、静态资源配置`ResourceConfig.java`、配置文件`application.yml`、前端HTML页面(单文件上传和多文件上传加表单内容)以及后端控制器`UserController.java`。文章最后展示了运行结果的截图。
931 0
SpringBoot+JQuery+Ajax实现表单数据传输和单文件或多文件的上传
|
JavaScript 前端开发 安全
安全开发-JS应用&原生开发&JQuery库&Ajax技术&加密编码库&断点调试&逆向分析&元素属性操作
安全开发-JS应用&原生开发&JQuery库&Ajax技术&加密编码库&断点调试&逆向分析&元素属性操作
260 5
|
XML JSON 前端开发
AJAX是什么?原生语法格式?jQuery提供分装好的AJAX有什么区别?
AJAX是什么?原生语法格式?jQuery提供分装好的AJAX有什么区别?
205 0
|
JavaScript 前端开发
Ajax的使用(jquery的下载)
这篇文章是关于Ajax学习笔记的分享,包括JQuery的下载方式、Ajax的主要参数说明,以及如何在网页中使用Ajax进行异步请求的示例代码。
|
XML JSON 前端开发
学习Ajax使用异步对象发送请求
Ajax,全称Asynchronous JavaScript and XML(异步JavaScript和XML),是一种用于创建更好、更快以及交互性更强的Web应用程序的技术。
185 3