Results 1 to 8 of 8

Thread: Dynamic Ajax Content - Jquery plugin inside of container

  1. #1
    Join Date
    May 2014
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Dynamic Ajax Content - Jquery plugin inside of container

    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

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    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):

    Code:
    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.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    May 2014
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    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:

    Code:
    <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:

    Code:
    <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

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    That's not Nilvo.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    May 2014
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

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

  6. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    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.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  7. #7
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    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.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  8. #8
    Join Date
    May 2014
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    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

Similar Threads

  1. Resolved Dynamic Ajax Content and JQuery Script.
    By GSimon in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 12-14-2012, 04:31 PM
  2. Dynamic Ajax Content with jquery plugins
    By ale3andros in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 03-19-2012, 06:51 PM
  3. Replies: 0
    Last Post: 08-31-2010, 02:19 AM
  4. Dynamic Ajax Content + imageslide-plugin
    By mlarino in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 12-12-2007, 04:53 PM
  5. Dynamic Ajax Content load an external website to a div-container
    By Grilly in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 07-03-2006, 01:40 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •