使用 Backbone.js 将表单输入序列化为 JSON [英] Serialize form inputs to JSON using Backbone.js

问题描述

我正在开发 RESTful 应用程序 - 我在服务器端使用 Java，在前端使用 Backbone.2 将通过 JSON 进行通信.

我的应用有很多表单，我想:

1. 将表单输入序列化为 JSON
2. 将 JSON 发送到服务器

我的问题:

1. 将表单输入序列化为 JSON 的最佳方法是什么?也许只有 Backbone 的解决方案?
2. 一旦表单输入序列化为 JavaScript 对象 - 将 JSON 发送到服务器的最佳方式是什么?

到目前为止我的代码:

Javascript 和 Backbone

$(function(){$.fn.serializeObject = function(){var o = {};var a = this.serializeArray();$.each(a, function() {if (o[this.name] !== undefined) {如果 (!o[this.name].push) {o[this.name] = [o[this.name]];}o[this.name].push(this.value || '');} 别的 {o[this.name] = this.value ||'';}});返回o;};//模型var SignupForm = Backbone.Model.extend();//看法var SignupView = Backbone.View.extend({el: '.signupForm',事件:{'点击 input.submit': 'getStatus'},获取状态:函数(事件){var data = JSON.stringify($('form').serializeObject());$('.test').html(数据);返回假；}});var signupForm = new SignupForm();var signupView = new SignupView({型号:注册表单});});

HTML

<表单类注册"><label for="name" >名称:</label><input type="text" id="name" name="name"/><label for="surname" >Surname:</label><input type="text" id="surname" name="surname"/><input type="submit" value="submit" class="submit"/></表单><div class="test"></div>

我是 Backbone 的新手，很抱歉，如果这是微不足道的.

我渴望以尽可能最好的方式编写我的应用程序，所以请随时告诉我是否有更好的方法来做到这一点.

非常感谢.

解决方案

对于序列化到 JSON 也有这个选项

https://github.com/marioizquierdo/jquery.serializeJSON

I'm working on RESTful application - I'm using Java on the server side and Backbone for the Front End. The 2 will communicate via JSON.

My App has quite a few forms and I would like to:

1. Serialize the form inputs to JSON
2. Send the JSON to the server

My questions:

1. What is the best way to serialize the form inputs to JSON? Perhaps a Backbone only solution?
2. Once the form inputs serialized to JavaScript Objects - what is the best way to send JSON to the server?

My code so far:

Javascript and Backbone

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

    //Model 
    var SignupForm = Backbone.Model.extend();

    //View
    var SignupView = Backbone.View.extend({
        el: '.signupForm',
        events: {
            'click input.submit': 'getStatus'
        },
        getStatus: function(event){
            var data = JSON.stringify($('form').serializeObject());
            $('.test').html(data);
            return false;
        }
    });

    var signupForm = new SignupForm();
    var signupView = new SignupView({
        model: signupForm
    });
});

HTML

<div class="signupForm">
    <form class"signup">
        <label for="name" >Name:</label>
        <input type="text" id="name" name="name" />

        <label for="surname" >Surname:</label>
        <input type="text" id="surname" name="surname" />

        <input type="submit" value="submit" class="submit" />
    </form>

    <div class="test"></div>
</div>

I'm new to Backbone so sorry if this is trivial.

I'm keen to code my application the best way as possible so please feel free to tell me if there is a better way to do this.

Thanks a lot.

解决方案

For just serializing to JSON there's this option as well

https://github.com/marioizquierdo/jquery.serializeJSON

这篇关于使用 Backbone.js 将表单输入序列化为 JSON的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！