Dynamic Ajax Content - Jquery plugin inside of container

[melitica]

1) Script Title: Dynamic Ajax Content

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...m#.Ukmo7YZtjmk

3) Describe problem: The dynamic ajax content script works perfectly, except when there is a Jquery plugin inside of the container it loads. I'm trying to load a page inside of a page, and this page has a plugin called Nivo Slider, that doesn't load when called with the DD script, but it works when I open the page separately. What is the best way to approach this issue?

Thank you

[jscheuer1]

Put the slider script's external script tags and its css link tag on the 'top' page and then run the initialization for the slider after the content for it has loaded. That would be here in the Dynamic Ajax Content script (highlighted section, additions red):

function loadpage(page_request, containerid){
if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
{
document.getElementById(containerid).innerHTML=page_request.responseText
$('#slider').nivoSlider();
}
}

But really, if you're using a jQuery based slider like Nivo, there's not much reason to use this AJAX script. jQuery has its own superior AJAX routines.

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

[melitica]

Hi! I'm sorry. I thought the problem was the slider but the slider is actually not being loaded by the Dynamic Ajax content script. What I'm trying to load with the script is a plugin called Maplace.

Here's the script:

<script type="text/javascript">
            new Maplace({
                locations: [
                    {
                        lat: 33.8583,
                        lon: -117.8678,
                        title: 'Anaheim',
                        html: [
                            '<h3>Anaheim</h3>',
                            '<p>1361 N RedGum St, Anaheim CA 92806<br>(714) 630-5954</p>'
                        ].join(''),
                        zoom: 8
                    },
                    {
                        lat: 34.2358,
                        lon: -118.5739,
                        title: 'Chatsworth',
                        html: [
                            '<h3>Chatsworth</h3>',
                            '<p>20233 Corisco St, Chatsworth CA 91311<br>(818) 998-3001</p>'
                        ].join(''),
                        zoom: 8
                    },
					{
                        lat: 32.8142,
                        lon: -117.1247,
                        title: 'San Diego',
                        html: [
                            '<h3>San Diego</h3>',
                            '<p>4000 Ruffin Road Suite K, San Diego CA 92123<br>(858) 292-1622</p>'
                        ].join(''),
                        zoom: 8
                    }
					,
					{
                      	lat: 34.9137,
                        lon: -120.4632,
                        title: 'Santa Maria',
                        html: [
                            '<h3>Santa Maria</h3>',
                            '<p>1459 W. Fairway Dr., Santa Maria CA 93455<br>(805) 922-4445</p>'
                        ].join(''),
                        zoom: 8
                    }
					,
					{
                        lat: 34.5011,
                        lon: -117.3279,
                        title: 'Victorville',
                        html: [
                            '<h3>Victorville</h3>',
                            '<p>15400-B Tamarack Road, Victorville CA 92392<br>(760) 243-5666</p>'
                        ].join(''),
                        zoom: 8
                    }
					,
					{
                        lat: 36.1605,
                        lon: -115.1050,
                        title: 'Las Vegas',
                        html: [
                            '<h3>Las Vegas</h3>',
                            '<p>3101 Builders Ave., Las Vegas, NV 89101<br>(702) 452-2440</p>'
                        ].join(''),
                        zoom: 8
                    }
					,
					{
                        lat: 33.1677,
                        lon: -117.2202,
                        title: 'Vista',
                        html: [
                            '<h3>Vista</h3>',
                            '<p>2055 Thibodo Rd, Vista CA 92081<br>(760) 599-0791</p>'
                        ].join(''),
                        zoom: 8
                    }
					,
					{
                        lat: 33.6224,
                        lon: -117.7194,
                        title: 'Laguna Hills',
                        html: [
                            '<h3>Laguna Hills</h3>',
                            '<p>23561 Ridge Route Suite P, Laguna Hills CA 92653<br>(949) 699-3308</p>'
                        ].join(''),
                        zoom: 8
                    }
					,
					{
                        lat: 34.4245,
                        lon: -118.4998,
                        title: 'Santa Clarita',
                        html: [
                            '<h3>Santa Clarita</h3>',
                            '<p>26846 Oak Ave Unit R, Santa Clarita CA 91315<br>(661) 424-9396</p>'
                        ].join(''),
                        zoom: 8
                    }
                ],
               map_div: '#gmap-list',
			   controls_type: 'list',
			controls_title: 'Choose a location:'
            }).Load();
        </script>

And here is the HTML markup:

<div id="gmap-dropdown"></div>
<div id="gmap-list" class="gmap"></div>

Thank you! You can also check out the website here. Just click on the tab that says contact us. The maps should be loading there

http://calstateautoparts.com/beta

[jscheuer1]

That's not Nilvo.

[melitica]

I am aware of that. I am trying to load another script, Maplace, inside of the Ajax loaded content, but it isn't loading.

[jscheuer1]

Just yanking your chain, I have a pet peeve about the job changing in the middle. I'll get over it.

Anyways, can you link me to a demo page on the site of the map working? I mean it looks like contactus.html is where the map is supposed to be, but even if I load that page just by itself, the map still isn't working.

[jscheuer1]

OK, never mind that. I figured it out. As I said, with jQuery, you don't need the Dynamic AJAX Content script. Here's a demo:

http://home.comcast.net/~jscheuer1/s...aps/caltop.htm

Use the browser's "View Source" to see the page. Also look at the source for the contactus page:

http://home.comcast.net/~jscheuer1/s...contactus.html

Any questions, just let me know.

[melitica]

Awesome! That worked out. Now I just have a bunch of css positioning issues, but the maps are loading perfectly.

http://calstateautoparts.com/beta

Thank you so much