backbone.js load different html

Question

i've been posting alot questions lately on stackoverflow due to my issues i'm facing recently and you guyz have realy helped me alot.

MY Question:

I'm working on backbone.js and i've worked on codeignitor on my project. Now my question is in ci, i can load views directly from ci view and can display dynamic html easily ( working fine for me). problem is i've to shift my js code and functions and ajax calls to backbone.js and i'm pretty much at the start of this project. i'm not clear on how can i show entirely new page html on some events in backbone. my question Not clear? let me explain further.

Explanation:

i mean i've some an index page and all of things load in this page ( sliders , footers etc etc ). whenever any item is clicked to see the details, ci calls the appropriate methods and gives me the html which displays that product in an entirely new page ( without loading ) with only image of that product and some other options for the product. it's pretty easy with ci, but how can i do this with backbone.js to show up different pages or entirely different html from index page and not showing other stuff of index page. i can work out how to move and design the logic behind it but i'm not getting the picture of how can i load these different html for different events ( like about button should show about us page, featured category should show featured products all in that main index file.)

I'm really desperate to get some directions. thnx guyz

Answer 1

I think you were meant to say you want to make single page application. Yes, backbone best idea to do so. You will required following :

• template ( should be inside <script type="text/template"> and </script> )
• backbone view
• backbone model
• backbone router