2012-02-20 7 views
2

これで、既存のアイテムを編集しているときに妥当性を確認できます。しかし、私が作成したいのであれば、何らかの理由で検証が開始されていない。代わりに、私は以下のエラーを見ています:ここでバックボーン - 検証は作成時には機能しません。更新/編集のみですか?

//this is if the field I want to validate is empty 
Uncaught TypeError: Object #<Object> has no method 'get' 

//this is if everything in the form is filled out 
Uncaught TypeError: Cannot call method 'trigger' of undefined 

は(私はと思われるもの)私のJSの相対的な部分です。その過負荷であれば申し訳ありませんが、私はできるだけ具体的に同じくらい私はできる限り追加したい:

Comic = Backbone.Model.extend({ 
    initialize: function() { 
     this.bind("error", this.notifyCollectionError); 
     this.bind("change", this.notifyCollectionChange); 
    }, 
    idAttribute: "ComicID", 
    url: function() { 
     return this.isNew() ? "/comics/create" : "/comics/edit/" + this.get("ComicID"); 
    }, 
    validate: function (atts) { 
     if ("Name" in atts & !atts.Name) { 
      return "Name is required"; 
     } 
     if ("Publisher" in atts & !atts.Publisher) { 
      return "Publisher is required"; 
     } 
    }, 
    notifyCollectionError: function (model, error) { 
     this.collection.trigger("itemError", error); 
    }, 
    notifyCollectionChange: function() { 
     this.collection.trigger("itemChanged", this); 
    } 
}); 
Comics = Backbone.Collection.extend({ 
    model: Comic, 
    url: "/comics/comics" 
}); 
comics = new Comics(); 

FormView = Backbone.View.extend({ 
    initialize: function() { 
     _.bindAll(this, "render"); 
     this.template = $("#comicsFormTemplate"); 
    }, 
    events: { 
     "change input": "updateModel", 
     "submit #comicsForm": "save" 
    }, 
    save: function() { 
     this.model.save(
      this.model.attributes, 
      { 
       success: function (model, response) { 
        model.collection.trigger("itemSaved", model); 
       }, 
       error: function (model, response) { 
        model.trigger("itemError", "There was a problem saving " + model.get("Name")); 
       } 
      } 
     ); 

     return false; 
    }, 
    updateModel: function (evt) { 
     var field = $(evt.currentTarget); 
     var data = {}; 
     var key = field.attr('ID'); 
     var val = field.val(); 
     data[key] = val; 
     if (!this.model.set(data)) { 
      //reset the form field 
      field.val(this.model.get(key)); 
     } 
    }, 
    render: function() { 
     var html = this.template.tmpl(this.model.toJSON()); 
     $(this.el).html(html); 
     $(".datepicker").datepicker(); 
     return this; 
    } 
}); 

NotifierView = Backbone.View.extend({ 
    initialize: function() { 
     this.template = $("#notifierTemplate"); 
     this.className = "success"; 
     this.message = "Success"; 
     _.bindAll(this, "render", "notifySave", "notifyError"); 
     comics.bind("itemSaved", this.notifySave); 
     comics.bind("itemError", this.notifyError); 
    }, 
    events: { 
     "click": "goAway" 
    }, 
    goAway: function() { 
     $(this.el).delay(0).fadeOut(); 
    }, 
    notifySave: function (model) { 
     this.message = model.get("Name") + " saved"; 
     this.render(); 
    }, 
    notifyError: function (message) { 

     this.message = message; 
     this.className = "error"; 
     this.render(); 
    }, 
    render: function() { 
     var html = this.template.tmpl({ message: this.message, className: this.className }); 
     $(this.el).html(html); 
     return this; 
    } 
}); 

var ComicsAdmin = Backbone.Router.extend({ 

    initialize: function() { 
     listView = new ListView({ collection: comics, el: "#comic-list" }); 
     formView = new FormView({ el: "#comic-form" }); 
     notifierView = new NotifierView({el: "#notifications" }); 
    }, 
    routes: { 
     "": "index", 
     "edit/:id": "edit", 
     "create": "create" 
    }, 
    index: function() { 
     listView.render(); 
    }, 
    edit: function (id) { 
     listView.render(); 
     $(notifierView.el).empty(); 
     $(formView.el).empty(); 
     var model = comics.get(id); 
     formView.model = model; 
     formView.render(); 
    }, 
    create: function() { 
     var model = new Comic(); 
     listView.render(); 
     $(notifierView.el).empty(); 
     $(formView.el).empty(); 
     formView.model = model; 
     formView.render(); 

    } 
}); 

jQuery(function() { 
    comics.fetch({ 

     success: function() { 
      window.app = new ComicsAdmin(); 
      Backbone.history.start(); 
     }, 
     error: function() { 

     } 
    }); 
}) 

そのため、あまりにも私の作成を検証取得するはずの?それはなぜですか?

+0

使用しているバックボーンのバージョンは? – ryanmarc

+0

私はこの同じ正確な問題を抱えています。 '新しいモデル({foo:bar})'を実行すると検証が実行されます。モデルはあなたが使用しているモデルのバリデーションを通して 'foo'を渡すことはありません。 – tkone

+0

0.5.3から0.9.1に0.9.1をアップグレードしたところ、0.5.3と同じモデルが使用されました。初期化ではモデルの検証は実行されません。それは本当に私にとっては気が狂っています。どこでも使用されていないとすれば、それ以外の点で妥当性検査を行う点は何ですか? – tkone

答えて

2

OK。だから、私はここで少し穏やかな成功を収めています。

まず、私が見つけたものはどれも好きではなかったので、自分自身の検証フレームワークBackbone.Validatorを書きました。

第2に、new Modelの作成中に提供されたオブジェクトにsilent: falseを設定して、検証ルーチンを無効にするための検証フレームワークを取得できました。

私の検証フレームワークのuse_defaultsパラメータを使用すると、最初のテストでセットアップ中に不良データを無効にすることができます。私はまだこれについていくつかのテストをしていますが、ChromeブラウザのコンソールからOKになっているようです。

+0

そして、すべての良いことのように、これはもはや働いていないようです...それとも決してあったと私は間違った結果を持っていて、それについて考えるのが面白かったです... – tkone

4

モデルの新しいインスタンスを作成するとき、validateメソッドは呼び出されません。バックボーンdocumentationによれば、検証はセットまたはセーブの前にのみ呼び出されます。

私もこの問題に苦しんで、関連の質問に解決策を見つけています

  • あなたは新しいモデルを作成して、その属性を設定することもできます(question 9709968を参照)
  • よりエレガントな方法は、検証を呼び出していますバックボーンdocumentationで説明したようなモデルの新しいインスタンスを作成するための方法のモデルを初期化するとき(question 7923074を参照)

私は、これらのソリューションに完全に満足していませんエラーが発生したときには発生しません。残念ながら、両方のソリューションでは、まだモデルの新しいインスタンスが残っています。

編集:モデルの新しいインスタンスで立ち往生しているのは、実際には素晴らしいです。このようにして、なぜバリデータを渡さなかったのか、入力を訂正する機会をユーザーに与えることができます。

関連する問題