trevoirwilliams
trevoirwilliams

Reputation: 478

Preload list into Backbone JS

I am trying to develop an application that will load a list of items on a page. Each item needs to be an individual model in order to track the respective attributes. So far I haven't been able to do this successfully in razor, as the list has loaded, but comes back empty on postback. I figured that backbone.js would help in this endeavour, but I have only been able to create a list, adding and deleting items on the fly, not preload them persay. How could I go about doing this?

Upvotes: 0

Views: 338

Answers (2)

Christopher Scott
Christopher Scott

Reputation: 2399

Using Backbone, it's recommended (in the docs) to load all models (for a collection) by bootstrapping them into place. For example, you could add a script tag to your html that does the following:

<script>
  var People = new Backbone.Collection;
  People.reset([{name: "Chris", age:30}, {name: "Josie", age: 27});
  var Projects = new Backbone.Collection;
  Projects.reset([{name: "Programming", due: "Monday"}, {name: "Cleaning", due: "Today"}]);
</script>

...from the Backbone docs, modified: http://documentcloud.github.com/backbone/#FAQ-bootstrap

Alternately, you could fetch() the contents (sends ajax request):

<script>
  var People = Backbone.Collection.extend({
    url: "/people"
  })
  People.fetch()
</script>

Upvotes: 1

34m0
34m0

Reputation: 5945

I'm not familiar with the Windows world, but one possible way of preloading is to simply get the server to write the list in script tags like

<script>
  window.myApp.myList = [
     { name: 'fred' },
     { name: 'mary' }
  ]
</script>

Then you can load that list with backbone code inline or in file:

var people = new PeopleCollection(window.myApp.myList)

Hope that is clear enough.

Upvotes: 0

Related Questions