在web开发过程中,经常遇到将form序列化不能格式的字符串提交到后台,下面就介绍怎样将form表单序列化为json字符串。

首先,是扩展的jquery序列化插件,依赖jquery。经测试,这段代码可以放在$(funciton(){})中,也可以放在外面,都可以实现效果。

$.fn.serializeObject = function()
{
var o = {};
var a = this.serializeArray();
$.each(a, function() {
if (o[this.name]) {
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;
};

如果上面的方法不能调用,还可以这样做(本人在实际开发中,上面方法使用不了,甚是纠结,就采用了此法):

function serializeObject(form)
{
var o = {};
var a = $(form).serializeArray();
$.each(a, function() {
if (o[this.name]) {
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;
};

调用如下:

function submitForm(){
var data= serializeObject("#form1");
alert(JSON.stringify(data));
}

如果需要是使用ajax请求的化,本人是用网络上的一个例子,也不错,如下:

function addPersonInfo(){  

   //序列化form

    var data = $('#personInfo').serializeObject();   

   $.ajax({

       type:"post",

       dataType: "json",

       url:"http://localhost:8080/appname/queryByCondition",

    data:JSON.stringify(data),

    contentType: "application/json;charset=utf-8",

    success: function(msg) {

    var notice = eval(msg);

    if(notice.type=="success"){

       alert(notice.msg);

       window.location.href=notice.data.url; 

    }else if(notice.type=="validFail"){

    $.each( notice.errors, function(index, dataValidMsg)

                   { 

                      alert(dataValidMsg.msg ); 

                    }); 

    }else if(notice.type="fail"){

    alert(notice.msg);

    }

    },

    error: function(msg) {

       var notice = eval(msg);

    alert(notice.msg);

    }

    }); 

}

上面的代码给我很多帮助,希望写出来可以帮助更多的朋友,同时也方便自己查阅借鉴。

form表单序列化为json格式数据的更多相关文章

  1. jQuery form表单序列化为JSON对象!

    /* 来源于博客园http://www.cnblogs.com/nixil/archive/2010/12/08/1900745.html */ function paramString2obj(se ...

  2. jQuery表单验证以及将表单序列化为json对象小练习

    jquery表单验证(非实时验证),同时,将表单序列化为json对象提交表单. <!DOCTYPE html> <html lang="en"> <h ...

  3. 023-将表单序列化为json对象

    使用jQuery将表单序列化为json对象,其中serializeJson方法的名字任意,serializeArray()这个jQuery提供的方法.this指的就是谁调用了这个方法. $.fn.se ...

  4. 将表单序列化为JSON对象

    将表单序列化为JSON对象的工具方法: $(function() { //工具方法,可以将指定的表单中的输入项目序列化为JSON数据 $.fn.serializeJson = function() { ...

  5. Jquery 将表单序列化为Json对象

    大家知道Jquery中有serialize方法,可以将表单序列化为一个“&”连接的字符串,但却没有提供序列化为Json的方法.不过,我们可以写一个插件实现. 我在网上看到有人用替换的方法,先用 ...

  6. form表单数据封装成json格式并提交给服务器

    1.jsp代码,form表单: <form action="#" id="costForm"> <input type="hidde ...

  7. form表单序列化为Jquery对象

    <form id="DailyFinancial" > @*class="form-inline"*@ <div class="fo ...

  8. 拓展jQuery的serialize(),将form表单转化为json对象

    jQuery 的 serialize() 方法经常会报 Uncaught TypeError: JSON.serializeObject is not a function 的错误, 原装的方法真的一 ...

  9. 将form表单转化为json数据

    参考地址:https://github.com/hongymagic/jQuery.serializeObject

随机推荐

  1. 如何开发简单的javaweb项目,jsp+javabean+servlet

    一.相关的软件下载和环境配置 1.下载并配置JDK. 2.下载eclipse. 3.下载并配置apache-tomcat(服务器). 4.下载MySQL(数据库). 5.下载Navicat for M ...

  2. [leetcode]300. Longest Increasing Subsequence最长递增子序列

    Given an unsorted array of integers, find the length of longest increasing subsequence. Example: Inp ...

  3. fastjson的常用方法

    /** * 解析对象形式的json字符串 */ public static void test1() { String jsonStr = "{\"JACKIE_ZHANG\&qu ...

  4. 【RabbitMQ】——5种队列(转)

    原文地址:https://blog.csdn.net/u012654963/article/details/76417613 应用RabbitMQ,我们可以根据需求选择5种队列之一. 一.简单队列 P ...

  5. 运行msckf_vio

     MSCKF_vio是一种基于多状态约束卡尔曼滤波器的双目视觉里程计.其中多状态约束是指将多帧图像的相机位姿加入卡尔曼状态向量中,在进行卡尔曼增益之前通过多帧图像之间的约束进行最小二乘优化来估计特征点 ...

  6. go语言中的接口interface

    package main; import "fmt" //接口interface //接口是一个或多个方法签名的集合 //只要某个类型拥有该接口的所有方法签名,即算实现该接口. / ...

  7. Vue 1.0 和 2.0 执行顺序

    // Vue 生命周期 // Vue 1.0 // 执行步骤:选项/生命周期钩子 // 1 init // 2 created // 3 beforeCompile // 4 compiled // ...

  8. SQL查询有两门以上不及格的学生及查询出全部及格的学生

    1.表结构: /*学生*/ create table student( sno int not null primary key, sname ) ); /*课程*/ create table cen ...

  9. PAT 1051 复数乘法(15 )(代码+思路)

    1051 复数乘法(15 分) 复数可以写成 (A+Bi) 的常规形式,其中 A 是实部,B 是虚部,i 是虚数单位,满足 i​2​​=−1:也可以写成极坐标下的指数形式 (R×e​(Pi)​​),其 ...

  10. DataStructure.BloomFilter

    Bloom Filters Ref[1] 1. 简介 Bloom filter(布隆过滤器:有更好的或正确的翻译,告诉我) 是一个数据结构,该数据结构快速并且内存高效,它可以告诉你某个元素是否在集合中 ...