`

js将form表单序列化[json字符串、数组、对象]

 
阅读更多

js将form表单序列化[json字符串、数组、对象]

(转至:http://www.cnblogs.com/bjlhx/p/6659392.html)

 

1.序列化为字符串

$("#Form").serialize();//name=zhangsan&sex=1&age=20  

2.序列化为数组

  var formData=$("#form").serializeArray();//[Object, Object, Object] 

自定义参数补充

  formData.push({"name": "psid", "value": $("#psid").val()});

3.序列化为对象

function getFormJson(form) {
        var o = {};
        var a = $(form).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;
    }

 

4.ajax传递普通数组

var deleteNum= [];//定义要传递的数组
deleteNum.push("1");
deleteNum.push("2");
deleteNum.push("3");//向数组中添加元素

$.ajax({
    type:"post",
    url:"deleteNum.do",
    data:{deleteNum:deleteNum},
    traditional: true,//必须指定为true
    success:function(data){
        if(data.success){
            deleteNum = [];
        }
    }
});

 后端代码

public AjaxResult deleteNum(String[] deleteNum){
    AjaxResult ajaxResult = new AjaxResult();
    //这个时候已经得到了deleteNum数组值
    return ajaxResult;
}

 

5.form表单提交自定义对象数组

<form id="form" name="form"  method="post">
 <input type="hidden" name="table" value="user">
  <table>
    <tr>
      <td><input type="text" name="userList[0].name"/></td>
      <td><input type="text" name="userList[0].password"/></td>
    </tr>
    <tr>
      <td><input type="text" name="userList[1].name"/></td>
      <td><input type="text" name="userList[1].password"/></td>
    </tr>
    <tr>
      <td><input type="text" name="userList[2].name"/></td>
      <td><input type="text" name="userLIst[2].password"/></td>
    </tr>
  </table>
</form>

 ajax提交

$("#form").serializeArray()

后端接收

public class FormList {
        private String table;
        private ArrayList<User> userlist;
        
        public String getTable() {
            return table;
        }
        public void setTable(String table) {
            this.table = table;
        }
        public ArrayList<User> getUserlist() {
            return userlist;
        }
        public void setUserlist(ArrayList<User> userlist) {
            this.userlist= userlist;
        }
    }

 

public AjaxResult saveUpdateUser(FormList form){
    List<User> userlist = list.getUserlist(); 
}

 

 

 

 

 

 

 

 

分享到:
评论

相关推荐

    用Javascript将form所有内容序列化和反序列化的例子。

    - **支持嵌套数据结构**:如果表单数据包含数组或对象,可能需要自定义序列化和反序列化逻辑,例如使用JSON.stringify()和JSON.parse()。 在`index.html`中,你可以创建一个表单,并在JavaScript文件(js)中实现上述...

    jQuery实现form表单元素序列化为json对象的方法

    接下来,我们将创建一个空对象`o`来存储序列化的JSON数据: ```javascript var o = {}; ``` 然后,我们使用`jQuery.each()`遍历由`serializeArray()`返回的数组: ```javascript jQuery.each(fields, function(i,...

    jQuery实现form表单序列化转换为json对象功能示例

    总结来说,jQuery的`serializeJson()`扩展方法提供了一种高效且易于使用的解决方案,帮助开发者快速将form表单数据转换为JSON对象,简化了前端开发中处理表单数据的过程。这对于使用Ajax提交表单或者需要在前后端...

    jQuery扩展将复杂form表单转成json对象

    在标题和描述提到的场景中,我们需要创建一个jQuery扩展,将复杂的form表单数据转换为JSON对象。这通常涉及到遍历表单元素,获取它们的值,并构建JSON对象。以下是一个简单的示例: ```javascript (function($) { ...

    jQuery序列化form表单数据为JSON对象的实现方法

    本文将介绍如何利用jQuery序列化form表单数据为JSON对象的实现方法,并提供实例代码来加深理解。 在Web开发中,表单提交是一个常见的操作,通常需要把表单中的数据转换成适合网络传输的格式。HTML表单通过表单元素...

    c#下post multipart/form-data和JSON

    1. 序列化对象为JSON:首先,定义一个C#对象,然后使用Json.NET的`JsonConvert.SerializeObject`方法将其转换为JSON字符串。 ```csharp public class MyData { public string Field1 { get; set; } public int ...

    将JavaScript的jQuery库中表单转化为JSON对象的方法

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

    基于jQuery的一个扩展form序列化到json对象

    然而,jQuery作为一个广泛使用的JavaScript库,并没有直接提供将表单序列化为JSON对象的内置方法。尽管如此,开发者社区已经提出了解决方案,使得我们可以借助现有的方法实现这一功能。 首先,来看一下jQuery的...

    在JavaScript中的对象到JSON字符串序列化期间使用修剪

    总之,在JavaScript中实现对象到JSON字符串的序列化时使用修剪,主要是通过控制`JSON.stringify()`的第二个参数,可以是过滤函数或属性名数组,或者借助于第三方库如`lodash`来实现更灵活的修剪策略。这对于优化数据...

    js获取form表单

    根据提供的标题“js获取form表单”及描述“ajax js一次性获取form表单”,我们可以明确本篇文章将围绕JavaScript(简称JS)中如何通过Ajax技术一次性获取HTML中的`&lt;form&gt;`表单数据进行详细介绍。 #### 二、知识点...

    c#模拟post发送json和multipart/form-data格式

    要将一个C#对象序列化为JSON字符串,可以使用`JsonConvert.SerializeObject()`方法;反序列化则使用`JsonConvert.DeserializeObject()`。 例如: ```csharp using Newtonsoft.Json; public class User { public ...

    form表单转Json提交的方法(推荐)

    - 为了兼容不支持JSON的旧版本浏览器,可以使用`eval`或者第三方库如`json2.js`来处理JSON字符串。 - 请确保在发送Ajax请求前,表单数据已经通过验证,避免无效数据被发送到服务器。 总结,将HTML表单数据转换为...

    jsp网页产生json传值到java的servlet,再回传到jsp页面

    上述代码创建了一个POST请求,将JSON字符串作为请求体发送到Servlet。 在服务器端,Java的Servlet接收这个请求并解析JSON数据。Servlet需要添加处理JSON的库,如Jackson或Gson。以下是一个使用Jackson处理JSON的...

    form表单序列化详解(推荐)

    Form 表单序列化是指将 HTML 表单中的键值对序列化为可提交的字符串,以便在客户端和服务器端之间进行数据交换。通过 Form 序列化,可以将用户输入的数据转换为一种标准的格式,以便在服务器端进行处理。 Form 序列...

    关于jquery form表单序列化的注意事项详解

    本文将深入探讨jQuery中`form`表单序列化时需要注意的事项,以及如何正确使用这一功能。 首先,我们要明白表单序列化的主要方法是`$.serialize()`和`$.serializeArray()`。`$.serialize()`将表单数据转换为字符串,...

    c#post multipart/form-data和JSON数据

    在C#中,可以使用Newtonsoft.Json库(通常称为Json.NET)来序列化和反序列化JSON数据。发送JSON数据的POST请求可以这样实现: ```csharp using Newtonsoft.Json; using System.Net.Http; var client = new ...

    JQuery扩展包-多种序列化方式

    Jquery自带的序列化,仅对form表单进行序列化,有很大的局限性,现在对齐进行扩展可以进行任意的序列化,包括json格式,字符串格式、数组格式,数组时自动转化为字符串等。并可以根据开发需要,随时扩展自己想要的...

Global site tag (gtag.js) - Google Analytics