3

when backbone app was loaded(for my app it means the page loaded),I need the initial collection data, and backbone docs says:

<script>
  var accounts = new Backbone.Collection;
  accounts.reset(<%= @accounts.to_json %>);
  var projects = new Backbone.Collection;
  projects.reset(<%= @projects.to_json(:collaborators => true) %>);
</script>

I don't understand this. Dose it mean I should render the page with the initial data like

{{collection_initial_data}}

I am using django on backends, so how do I translate the above code into django template, something like

 <script>
  var accounts = new Backbone.Collection;
  accounts.reset({{ @accounts.to_json }});
  var projects = new Backbone.Collection;
  projects.reset({{ @projects.to_json(:collaborators => true) }});
</script>

anyway I am really confused about getting the initial data of backbone collection.

tshepang
  • 12,111
  • 21
  • 91
  • 136
paynestrike
  • 4,348
  • 14
  • 46
  • 70
  • 1
    From Backbone's doc: "*Note that fetch should not be used to populate collections on page load — all models needed at load time should already be bootstrapped in to place.*". This simply means your data should be loaded with the page itself, not asynchronously by making a lot of AJAX call. About the django part, I don't know how, but you'll have to print the data in JSON representation. – Loamhoof Apr 24 '13 at 15:03
  • 1
    yes that why i ask this question, " all models needed at load time should already be bootstrapped in to place" , but how??? – paynestrike Apr 24 '13 at 15:04
  • Simply print them in the page you send the client (that's what the example's doing). Never worked with django, can't help you with that part (I'd have posted an answer if I could help you here). – Loamhoof Apr 24 '13 at 15:07
  • I really like to know what the code above means – paynestrike Apr 24 '13 at 15:18

1 Answers1

5

When Backbone talks about bootstrapping, they're talking about this:

http://documentcloud.github.io/backbone/#FAQ-bootstrap

In other words, they're saying you should write out the contents of your models in your Django HTML template, inside a script tag.

For instance, let's say your Django context has a variable called "foo_models", which contains the JSON representation of all of your foo models. You'd want to edit your Django template to do something like:

<script>
var foo_models = new FooCollection({{foo_models}});
</script>

In this way you can guarantee that your data is ready on the page as it gets loaded, and your JS code can use the JS foo_models to access that data.

Now, your confusion seems to be with how to make the foo_models Python/Django variable in the first place. I'd recommend doing this in your View logic, not in the template, as there you can use the full power of Python and its libraries to serialize the JSON. However, if you do want to do it in your view, you can do so with a syntax that's pretty similar to what you specified; check out the second answer to this SO question:

Django: Parse JSON in my template using Javascript

Community
  • 1
  • 1
machineghost
  • 33,529
  • 30
  • 159
  • 234