View Full Version : How can I keep the next/back pages in the div?

04-26-2012, 09:53 PM
1) Script Title: Dynamic Ajax Content

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm

3) Describe problem:
I managed to get this working beautifully on the desktop with my own HTML pages and CSS styling. However, when the page is inserted into the div on the right, and has next/back buttons coded with <a href=""> tags, then those buttons open the next or back pages in the full window.

How can I keep the next/back pages in the div? The left div needs to be kept clear for navigation.


04-27-2012, 06:28 AM
Do the links inside your Ajax loaded page also point to local pages within your domain? What you're asking is possible provided that they do, as Ajax is currently limited by the same origin domain limitation.

04-27-2012, 02:30 PM
Yes, the prev/next files referenced in the rightcolumn div are actually all in the same folder with each other.

How should the script be changed to allow them to stay in the same rightcolumn div?

The only alternative to this script is to put them in a table, with the navigation links as targets pointing to the right frame, and all the links in the right frame as targets to the same frame.

04-29-2012, 08:19 AM
To load a link inside one of the Ajax loaded pages once again inside the right column, you can simply edit that link's href attribute to also call the ajaxpage() function. So lets say "external.htm" is dynamically loaded via Ajax, and inside this page, you have a link to "external2.htm" that you also wish to load via Ajax in the same DIV when clicked on. That link would look something like this:

<img border="0" src="ajaxfiles/porschegt.jpg" width="540" height="340">
<h3 id="cartitle" style="border-bottom: 1px solid #C0C0C0; margin-bottom: -5px">Porsche Carrera GT</h3>
<p>The Carrera GT has a 5.7 litre V10 internal combustion engine that produces
605 SAE horsepower (451 kW). Porsche claims it will accelerate from 0 to 100
km/h (62 mph) in 3.9 seconds and has a maximum speed of 330 km/h (204 mph).
With 605 hp, the car weighs 1,380 kg (3,042 lb). The Carrera GT is only
offered with a six-speed manual transmission, in contrast to its rival the
Ferrari Enzo that is only offered with sequential manual transmission. Also
the Carrera GT is significantly less expensive than the Ferrari Enzo. The
Ferrari Enzo is priced around $660,000 to the Carrera GT's $440,000. The
Carrera GT is known for its high quality and reliability which makes it one of
the best supercars ever. [<a href="javascript:ajaxpage('ajaxfiles/external2.htm','rightcolumn')">source</a>]

Just remember when specifying the path to external2.htm that it should be relative to the directory where the parent page, or external.htm, is located in. If in doubt try setting things up initially so both pages are in the same directory to verify that it works as intended first.

04-30-2012, 02:33 PM
Thank you very, very much!!