Trigger.io で構築しているバックボーン アプリがあり、電話のツールバーの [戻る] ボタンをクリックするとデータが消える理由が少しわかりません。
セットアップは次のとおりです。
次のようなビュー、SearchResultsView があります (簡潔にするために Trigger.io コードは削除されています)。
window.SearchResultsView = Backbone.View.extend({
initialize: function() {
this.template = _.template($('#searchResultsView-template').html());
},
render: function() {
var self = this;
var renderedContent = this.template();
$(this.el).html(renderedContent);
if (window.resultsCollection) {
self.drawList(window.resultsCollection);
}
return this;
},
events: {
"click #submitQuery" : "processClick"
},
drawList: function(collection) {
collection.each(function(place){
window.console.log(place.get("name"));
$("#resultsList").append("<li><a href='#locationdetail/"+place.id+"' class='link'>" + place.get("name") +"</a></li>");
});
},
processClick: function() {
var self=this;
this.querystring = $("#searchBox").val(); //get the query
window.resultsCollection = new Places(null, {query: this.querystring});
window.resultsCollection.fetch(); //this is fetching via a call to the FourSquare API, and populating the models in the collection with that data
window.resultsCollection.bind('reset', function(collection){
self.drawList(collection);
});
}
});
テンプレートは次のとおりです。
<script type="text/template" id="searchResultsView-template">
<div id="searchbar"></div>
<h1>Results Bitch</h1>
<input type="text" id="searchBox"></input>
<input type="submit" id="submitQuery"></input>
<ul data-role="listview" id="resultsList">
</ul>
<a href="locationdetail">Click me</a>
</script>
そして、ここにルーターがあります:
searchresults: function() {
this.searchresults = new SearchResultsView({});
$('#container').empty();
$('#container').append(this.searchresults.render().el);
},
実際にどのように機能するかは次のとおりです。最初にページをロードしたとき、結果のリストはありません (そうあるべきです)。クエリを入力して検索を実行すると、返されて、必要に応じてリストに入力されます。次に、アイテムをクリックして別のビューに移動し、[戻る] をクリックすると、リストは再び空になります。
私がやろうとしているのは、コレクションがまだ存在するかどうかをテストすることです。存在する場合は、先に進んでリストを再レンダリングしますが、リストをレンダリングすることはありません。コンソールにログを記録してデータを表示できるため、コレクションは存在します。
私の疑いでは、 #resultsList 要素がまだ利用できないため、結果を追加しようとすると、それが見つからないため、何も表示されません。
そう:
- これは正しいと思いますか?
- なんで?これは、正常に動作する初期ロードとどう違うのでしょうか?
うまくいけば、私は十分に明確です。簡潔にするために、モデルとコレクションは含めていません。それらが役立つ場合は、喜んでそれらを含めます (ただし、これはビューの問題であると考える傾向があります)。
ありがとう!