View Full Version : Virtual Pagination within Tabbed Content

07-09-2008, 11:36 AM
1) Script Title:
Virtual Pagination and Tabbed Content

2) Script URL (on DD):

3) Describe problem:
I'm trying to run virtual pagination from within two different tabs that utilize the tabbed content script. So, I add the paginate content/code under tab 1 and everything works great. The problem arises when I add paginated content/code under tab 2. Suddenly the first one stops operating and the second one is blank. I've tried several work-arounds, including renaming the "virtualpaginate3" call to another name for the content in the second tab, i.e. "virtualpaginate3" and then added that name to the .css file. Although several of my work-arounds come close to fixing the issues, I just can't beat it.

I've reviewed the virtualpaginate.js file and can't find where a conflict would be with the naming. Is there a problem with .js conflicts between the same call being made twice from within another scripted environment (the different tabs themselves). My lingo is probably off and I'm not 300% savvy like some folks, but what I'm going for here is pretty simple. For reference, I've included a screen cap below so you can see the use of these two scripts together, one inside the other. This image shows a healthy, functioning setup under tab 1 with no content/code under tab 2 yet.

MANY thanks in advance.


07-10-2008, 02:36 AM
So, when you go to the next page on the paginate, does that work?
Can I also see a link to your page. That will probably help me, and give me a feeling of how you are linking these to scripts together.

07-11-2008, 08:39 AM
Hey Nile, thanks for offering to help. I've been running everything locally, so let me upload it to my server...should be able to do it later tonight.

A side note, I attempted to use the Ajax Tabs Content Script (http://www.dynamicdrive.com/dynamicindex17/ajaxtabscontent/index.htm) to see if it would healthily load the pagination script via an external .htm document. Unfortunately, it doesn't function properly either - tab 1 works fine, but when I click on tab 2 it "works", but by opening the content in a new page vs. within the same div via an ajax call. The fact that tab 1 works and tab 2 doesn't is consistent with the problem that arises using the non-ajax tabbed content script, but I don't know if there's a connection.

Check back here tomorrow and I'll hopefully have the stuff uploaded with a link posted.

Again, many thanks.

07-11-2008, 11:29 AM
I've put together a few examples of ways I tried to "work my magic" in hopes of a fix, but none of them have had a positive result. I know just enough myself into get in trouble... :)

Sample 1 (http://www.therededitor.com/ddhelp/sample1.html)
Paginated content placed within tab #1 only.
Pagination works healthily.

Sample 2 (http://www.therededitor.com/ddhelp/sample2.html)
Identical paginated content placed within both tabs 1 and 2.
Tab 1 now shows a page count of 8 instead of 4, meaning that it's pulling info from tab 2. Tab 1 functions fine though page 4, but then goes blank and content begins to appear under tab 2. The proper info shows up for the relative pages in tab 2, but there's no navigation, so you have to keep switching tabs to see the new content.

Sample 3 (http://www.therededitor.com/ddhelp/sample3.html)
Content the same, changed the class name for each 'page' under tab 2 and added new class name to stylesheet.
Tab 1 now performs properly, but tab 2 displays all content in a single, long column.

Sample 4 (http://www.therededitor.com/ddhelp/sample4.html)
Content the same, Javascript call name changed to create a unique id for each tab of paginated content.
Tab 1 now shows only page 1's content regardless of page selection. Upon selecting a new page, that content appears under tab 2.

If you need other information, Nile, don't hesitate to let me know. I'll post code, send you files, whatevz...

Of course, many thanks.

07-11-2008, 01:18 PM
Hmm, I don't know if I can figure it out. It's pretty complicated.

07-14-2008, 07:55 AM
Ok. How is it possible to get the opinion of others? Both script authors say "Dynamic Drive", so someone "there" should know something.

Could it be as simple as the order in which I'm referencing the .js files in my header?


08-17-2008, 10:43 AM

09-13-2008, 01:37 AM
did you have to modify the tab or virtual pagination scripts to work? i can get the first page of the pagination to load into a tab but if i click next, i get nothing.

09-13-2008, 02:23 AM
I wasn't able to get any resolution on the issues I was having and had to give up my efforts and switch nav methods. It's possible to use one instance of virtual pagination inside of the tabbed content, but not two. It's a bummer, to someone like me with limited programming skills, to download and use the script to get zero support from those who produced and put it out there. Wish I could help you more...

09-13-2008, 05:00 AM
I only need to use the virtual pagination in one tab, but cant even seem to get that to work. the pagination works fine by itself but as soon as i put it in one tab only the first "page" will show. how did you get the pagination to work inside the tab?

09-13-2008, 07:01 AM
I don't think I did anything special to get the paginated content running under the first tab, it was just when I tried adding more pagination to other tabs.

I'm not sure what to suggest. Nesting is really key and plagued me for a while when I first set it up. Maybe post some code or a link to the problem page.

09-13-2008, 03:31 PM
i was able to get 4 virtual paginations running in all 4 tabs i have by using rel="#iframes". now i need to figure out how to resize the iframe and i think i will be in good shape.