2012-05-20 8 views
8

Desidero implementare una semplice pagina di ricerca utilizzando Backbone. Non è un'applicazione a singola pagina, ma vorrebbe comunque strutturare il mio codice JavaScript usando Backbone. Una pagina di ricerca è composta da un modulo di ricerca e risultati di ricerca. La ricerca viene effettuata tramite AJAX e deve essere salvata nella cronologia. Quando la pagina viene caricata dalla cronologia, i parametri della query di ricerca devono essere caricati nel modulo. Il modulo di ricerca e i risultati della ricerca possono essere implementati come Backbone.View. Tuttavia, ho problemi a incollarli insieme.Pagina di ricerca Backbone semplice: come faresti?

Quello che penso di cui ho bisogno è una sorta di controller. C'è un Backbone.Router, ma è il posto giusto? Dove dovrebbe essere collocata la chiamata AJAX?

Qualsiasi consiglio sulla struttura di tale pagina è ben accetto.

risposta

10

È possibile creare un SearchModel. Il SearchModel avrebbe un metodo come: "performSearch (stringa)" che sparerebbe dalla chiamata ajax. Quando la chiamata restituisce il modello potrebbe fare qualcosa di simile:

this.set("searchResults", ajaxResult) 

e le vostre opinioni può legarsi a quella proprietà del modello:

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

esempio vista modulo di ricerca per riferimento:

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

esempio SearchModel per riferimento:

Backbone.Model.extend({ 
    performSearch: function(string) { 
     // fire your ajax request. provide a bound 
     // _searchComplete as the callback 
    }, 
    _searchComplete: function(results) { 
    this.set("searchResults", results); 
    } 
}); 
Problemi correlati