2012-05-20 28 views
8

Tôi muốn triển khai một trang tìm kiếm đơn giản bằng cách sử dụng Backbone. Nó không phải là một ứng dụng trang duy nhất, nhưng vẫn muốn cấu trúc mã JavaScript của tôi bằng cách sử dụng Backbone. Trang tìm kiếm bao gồm biểu mẫu tìm kiếm và kết quả tìm kiếm. Việc tìm kiếm được thực hiện thông qua AJAX và phải được lưu trong lịch sử. Khi trang được tải từ lịch sử, các tham số truy vấn tìm kiếm sẽ được tải vào biểu mẫu. Biểu mẫu tìm kiếm và kết quả tìm kiếm có thể được thực hiện dưới dạng Backbone.View's. Tuy nhiên, tôi có vấn đề với việc dán chúng lại với nhau.Trang tìm kiếm Backbone đơn giản - bạn sẽ làm như thế nào?

Điều tôi nghĩ tôi cần tôi là một loại bộ điều khiển. Có một Backbone.Router, nhưng nó có đúng không? Cuộc gọi AJAX nên được đặt ở đâu?

Bất kỳ lời khuyên nào về cấu trúc của trang như vậy đều được hoan nghênh.

Trả lời

10

Bạn có thể tạo SearchModel. SearchModel sẽ có một phương thức như: "performSearch (chuỗi)" sẽ kích hoạt cuộc gọi ajax của bạn. Khi cuộc gọi trả về mô hình có thể làm một cái gì đó như:

this.set("searchResults", ajaxResult) 

và quan điểm của bạn có thể liên kết với tài sản của mô hình:

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

dụ hình thức tìm kiếm xem để tham khảo:

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

ví dụ SearchModel để tham khảo:

Backbone.Model.extend({ 
    performSearch: function(string) { 
     // fire your ajax request. provide a bound 
     // _searchComplete as the callback 
    }, 
    _searchComplete: function(results) { 
    this.set("searchResults", results); 
    } 
}); 
Các vấn đề liên quan