8

Backboneを使用して簡単な検索ページを実装したいと思います。これはシングルページアプリケーションではありませんが、Backboneを使用してJavaScriptコードを構造化したいと考えています。検索ページは、検索フォームと検索結果で構成されます。検索はAJAXを介して行われ、履歴に保存する必要があります。ページが履歴から読み込まれるとき、検索クエリパラメータをフォームに読み込む必要があります。検索フォームと検索結果は、Backbone.Viewとして実装できます。しかし、私はそれらを一緒に接着するのに問題があります。

ある種のコントローラーが必要だと思います。Backbone.Routerがありますが、それは適切な場所ですか？AJAX呼び出しはどこに配置する必要がありますか？

そのようなページの構造に関するアドバイスは大歓迎です。

4

1 に答える 1

10

を作成できますSearchModel。ajax呼び出しを開始する「performSearch(string)」のSearchModelようなメソッドがあります。呼び出しが返されると、モデルは次のようなことを行うことができます:

this.set("searchResults", ajaxResult)

ビューはモデルのそのプロパティにバインドできます。

// SearchResultsView
Backbone.View.extend({
    initialize: function() {
        this.model.on("change:searchResults", this.displayResults, this);
    },
    displayResults: function(model, results) {
        // do whatever...
    }
});

参照用の検索フォーム ビューの例:

Backbone.View.extend({
   events: {
      "submit": "formSubmitted"
   },
   formSubmitted: function(e) {
      this.model.performSearch(e.target.value);
   }
});

参考例SearchModel：

Backbone.Model.extend({
   performSearch: function(string) {
      // fire your ajax request.  provide a bound
      // _searchComplete as the callback
   },
   _searchComplete: function(results) {
     this.set("searchResults", results);
   }
});
于 2012-05-21T04:58:02.373 に答える