11

私はRESTfulアプリケーションに取り組んでいます-サーバー側でJavaを使用し、フロントエンドにバックボーンを使用しています。2 つは JSON 経由で通信します。

私のアプリにはかなりの数のフォームがあり、次のことをしたいと考えています。

  1. フォーム入力を JSON にシリアル化する
  2. JSON をサーバーに送信する

私の質問:

  1. フォーム入力を JSON にシリアル化する最良の方法は何ですか? おそらくバックボーンのみのソリューションですか？
  2. フォーム入力が JavaScript オブジェクトにシリアル化されたら、JSON をサーバーに送信する最良の方法は何ですか?

これまでの私のコード:

Javascript とバックボーン

$(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>

Backbone は初めてなので、些細なことでしたら申し訳ありません。

私は自分のアプリケーションをできる限り最善の方法でコーディングしたいと考えています。これを行うためのより良い方法があれば、遠慮なく教えてください。

どうもありがとう。

4

4 に答える 4

5

JSONにシリアル化するだけの場合、このオプションもあります

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

于 2013-08-14T21:28:05.560 に答える
2

もう 1 つの解決策は、backbone.syphon拡張機能を使用することです。これにより、エンティティがフォームを作成するのと同じ方法でフォームを簡単に送信できます。

Backbone.View.extend({
  events: {
    "submit form": "formSubmitted"
  },

  formSubmitted: function(e){
    e.preventDefault();

    var data = Backbone.Syphon.serialize(this);
    this.model.set(data);

    this.model.save();
  }
});
于 2013-10-23T14:02:07.033 に答える