framework7

Open full view…

How to seperate eacb tab into its own page

Dan Gillespie
Wed, 16 Jul 2014 04:16:15 GMT

Hi guys, I'm a newbie to Framework 7 but I have previously worked with jQuery Mobile.. I want to create a "tab bar" style web app ( ex http://www.idangero.us/framework7/examples/tab-bar/ ) but I'm not sure how to separate each tab page into its own html file. Is this possible? I think it would be much neater to have each view in its own file and less stuff loaded into the DOM all at once on a mobile device. I was looking in the documentation but didn't quite find the answer I was looking for and I have had nothing but trouble so far.. Thanks!

csalopek
Wed, 16 Jul 2014 13:52:57 GMT

Hi Dan, I had the same question when I started out. Take a look at this thread: http://www.idangero.us/framework7/forum/#!/questions:pages-in-the-tab-bar-exampl

Dan Gillespie
Wed, 16 Jul 2014 18:35:15 GMT

Hi, thank you for your reply! That post was very informative.. did you end up trying out the ajax method? If so.. do you have a practical example of how to use an AJAX request to load new content into the DOM for the given "page" or "tab" while also removing old page DOM content? I'm thinking that if I keep as little HTML in the DOM as possible that it'll improve overall memory and performance and run better on the device.. or is this not the best method?

csalopek
Thu, 17 Jul 2014 12:24:38 GMT

I ended up structuring my code just like deanl did in his example using separate Web User Controls for each of my main tab buttons on the bottom. For every place you have a ListView or buttons that open other pages, you can use standard aspx or html pages.