将表单数据序列化为JSON

我想在Backbone.js模型中对表单进行一些服务器前验证。为此，我需要将用户输入的表单转换为可用的数据。我找到了三种方法:

var input = $（“#inputId”）.val（）; var input = $（“form.login”）.serialize（）; var input = $（“form.login”）.serializeArray（）;

不幸的是，没有一个提供我所需要的良好的可读和可开发的JSON对象。我已经浏览了Stack Overflow上的几个问题，但我只找到了一些额外的库。

现在的jQuery或Backbone.js没有提供一个辅助方法吗?

我无法想象没有对这种功能的要求。

HTML

<form class="login">
    <label for="_user_name">username:</label>
    <input type="text" id="_user_name" name="user[name]" value="dev.pus" />
    <label for="_user_pass">password:</label>
    <input type="password" id="_user_pass" name="user[pass]" value="1234" />
    <button type="submit">login</button>
</form>

JavaScript

var formData = $("form.login").serializeObject();
console.log(formData);

输出

{
    "name": "dev.pus",
    "pass": "1234"
}

Backbone.js模型

var user = new User(formData);
user.save();

当前回答

我的贡献:

function serializeToJson(serializer){
    var _string = '{';
    for(var ix in serializer)
    {
        var row = serializer[ix];
        _string += '"' + row.name + '":"' + row.value + '",';
    }
    var end =_string.length - 1;
    _string = _string.substr(0, end);
    _string += '}';
    console.log('_string: ', _string);
    return JSON.parse(_string);
}

var params = $('#frmPreguntas input').serializeArray();
params = serializeToJson(params);

2014-06-26 19:08:54

其他回答

使用Underscore.js:

function serializeForm($form){
    return _.object(_.map($form.serializeArray(), function(item){return [item.name, item.value]; }));
}

2014-10-05 22:14:44

下面是我在这种情况下作为模块使用的(在我的formhelper.js中):

define(function(){
    FormHelper = {};

    FormHelper.parseForm = function($form){
        var serialized = $form.serializeArray();
        var s = '';
        var data = {};
        for(s in serialized){
            data[serialized[s]['name']] = serialized[s]['value']
        }
        return JSON.stringify(data);
    }

    return FormHelper;
});

我似乎找不到另一种方法来做我想做的事情，这有点糟糕。

这确实为我返回了这个JSON:

{"first_name":"John","last_name":"Smith","age":"30"}

2013-11-20 11:46:26

我的贡献:

function serializeToJson(serializer){
    var _string = '{';
    for(var ix in serializer)
    {
        var row = serializer[ix];
        _string += '"' + row.name + '":"' + row.value + '",';
    }
    var end =_string.length - 1;
    _string = _string.substr(0, end);
    _string += '}';
    console.log('_string: ', _string);
    return JSON.parse(_string);
}

var params = $('#frmPreguntas input').serializeArray();
params = serializeToJson(params);

2014-06-26 19:08:54

如果你不关心具有相同名称的重复表单元素，那么你可以这样做:

var data = $("form.login").serializeArray();
var formData = _.object(_.pluck(data, 'name'), _.pluck(data, 'value'));

我在这里使用的是Underscore.js。

2013-12-14 18:31:25

你可以这样做:

函数onSubmit(form){ var data = JSON。stringify($(form).serializeArray());// <----------- Console.log (data); 返回错误;/ /不提交｝ < script src = " https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js " > < /脚本> <form onsubmit='return onsubmit (this)'> <input name='user' placeholder='user'><br> <input name='password' type='password' placeholder='password'><br> <按钮类型= '提交' > > < /按钮试试 > < /形式

请看这个:http://www.json.org/js.html

2012-07-05 06:27:26

将表单数据序列化为JSON

推荐文章

最新文章

标签