jquery - Backbone.js - instantiate Models/Views from exisiting html -
i've started looking @ backbone.js today way better organize code in application.
i wondering (conceptually - reply pseudocode means) how use existing html create backbone models (and views).
all of tutorials i've found consist of using blank html template , injecting in content using ajax. don't want this.
if have collection of books.
<!doctype html> <html lang="en-us"> <head> <meta charset="utf-8"> <title>my book collection</title> </head> <body> <head> </head> <body> <ul id="bookcollection"> <li class="book" data-book-id="1"><input type="text" name="book_1_name" value="my book a"/></li> <li class="book" data-book-id="2"><input type="text" name="book_2_name" value="my book b"/></li> <li class="book" data-book-id="3"><input type="text" name="book_3_name" value="my book c"/></li> <li class="book" data-book-id="4"><input type="text" name="book_4_name" value="my book d"/></li> <li class="book" data-book-id="5"><input type="text" name="book_5_name" value="my book e"/></li> </ul> </body> </body> </html>
at stage start managing each book model, calling function whenever book names changed (just alert in function proof of concept), , calling url sync changes model database.
can point me in right direction way above using existing html on page?
if makes difference plan on using mustache templating.
backbone's views bound specfic html element (the view's attribute el
). have bookcollectionview
bound ul#bookcollection
, bookview
bound li.book
, should fine current template structure.
you can map book
model view using url model. if model fetched url , have defined event binding model change, according view should refresh new model data. same applies collection's url , collection of books.
there not many tutorials on backbone out guess, study http://liquidmedia.ca/blog/2011/02/backbone-js-part-3/ or http://www.jamesyu.org/2011/02/09/backbone.js-tutorial-with-rails-part-2/. guess easier if can come more concrete questions!
Comments
Post a Comment