Results 1 to 5 of 5

Thread: Lightbox won't work from a page loaded with ajax

  1. #1
    Join Date
    Dec 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Lightbox won't work from a page loaded with ajax

    Hello everyone,
    i have a weird problem.
    I'm trying to run a modified lightbox version from a page loaded through ajax. The lightbox runs fine if i embed the page with php using the include function. But if i load exactly the same page via ajax it wont work for some reason.

    Here is my ajax code:
    Code:
    function ShowNewReleases(startfrom) {
    	var ajaxRequest;
    	
    	try{
    		ajaxRequest = new XMLHttpRequest();
    	} catch (e){
    		try{
    			ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
    		} catch (e) {
    			try{
    				ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
    			} catch (e){
    				alert("Your browser broke!");
    				return false;
    			}
    		}
    	}
    	ajaxRequest.onreadystatechange = function(){
    		if(ajaxRequest.readyState == 4){
    			var ajaxDisplay = document.getElementById('DivNewReleases');
    			ajaxDisplay.innerHTML = ajaxRequest.responseText;
    		}
    			else {
    			var ajaxDisplay = document.getElementById('DivNewReleases');
    			ajaxDisplay.innerHTML = '<br><br><br><br><br><br><image src=\"php/ajax-loader.gif\">';
    		}
    	}
    	ajaxRequest.open("GET", "php/main.php?startfrom=" + startfrom, true);
    	ajaxRequest.send(null); 
    }
    you can see a live example of this here:
    http://www.it-leaked.com/v4alpha/
    you'll notice that the box works fine when clicking on the + button on the mainpage, but if you click on the back button and then on the + on the loaded page the lightbox wont show up
    if you need any other files let me know
    thanks for the help i hope someone can give me a hint
    Last edited by robs; 12-23-2008 at 03:48 PM.

  2. #2
    Join Date
    Dec 2008
    Location
    Nigeria
    Posts
    95
    Thanks
    3
    Thanked 8 Times in 8 Posts

    Default

    Your code is not complete, and your site seem to be inaccessible. Try completely clearing your cache in internet explorer, and test again, if it works with clear cache then u will need to replace the following line
    ajaxRequest.open("GET", "php/main.php?startfrom=" + startfrom, true);
    with something like
    ajaxRequest.open("GET", "php/main.php?startfrom=" + startfrom +"&cache="+new Date().getTime(), true);

    Otherwise, provide us with a complete code/test code...

  3. #3
    Join Date
    Dec 2008
    Location
    Nigeria
    Posts
    95
    Thanks
    3
    Thanked 8 Times in 8 Posts

    Default

    Your code is not complete, and your site seem to be inaccessible. Try completely clearing your cache in internet explorer, and test again, if it works with clear cache then u will need to replace the following line
    ajaxRequest.open("GET", "php/main.php?startfrom=" + startfrom, true);
    with something like
    ajaxRequest.open("GET", "php/main.php?startfrom=" + startfrom +"&cache="+new Date().getTime(), true);

    Otherwise, provide us with a complete code/test code...

  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

    You are not using lightbox, rather a mootools 'lightbox clone'. Lightbox 2.04 and 2.04a are both AJAX friendly.

    See:

    http://www.dynamicdrive.com/forums/s...ad.php?t=37030

    For links and some info about both Lightbox versions mentioned.
    - John
    ________________________

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

  5. #5
    Join Date
    Dec 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hey,
    thanks for all the replies, i've already sorted out what was wrong. After playing around a bit i found out that i had to initialize this code after each pageload:
    Code:
    		<script type="text/javascript"> 
    			var box = {};
    			window.addEvent('domready', function(){
    				box = new MultiBox('mb', {descClassName: 'multiBoxDesc', useOverlay: true});
    			});
    		</script>
    after that it worked like a charm.



    I've got another problem though. I didn't create a new thread cause i didn't want to flood the forums, i hope people can still help me out
    i'm trying to load a php file through AJAX which accesses the mysql db. the file loads fine, but for some reason i can't run any javascript functions inside the file. here's the code:

    PHP Code:
    <?php

    include ('sql.php');

    if (!
    $_GET[start]) { $_GET[start] = 0; }

    $result mysql_query("SELECT * FROM `posts` WHERE `post_content` NOT LIKE '' AND `post_status` NOT LIKE 'draft' AND `post_status` NOT LIKE 'inherit' $sqlsearch ORDER BY `post_date` DESC , `ID` DESC LIMIT $_GET[start] , 1");

    if (
    mysql_num_rows($result) == 0) {
    echo 
    "Sorry, no posts found. Please search for something else.<br>";
    }

    while(
    $row mysql_fetch_array($result))
    {
    echo 
    "$row[post_title]<br><br>";
    if (
    $row[genre3]) { echo "$row[genre1] - $row[genre2] - $row[genre3]"; }
    elseif (
    $row[genre2]) { echo "$row[genre1] - $row[genre2]"; }
    else { echo 
    $row[genre1]; }

    echo 
    "<br><br><br><a href=\"javascript:runme();\">Run Me</a>";
    }
    ?>
    <script type="text/javascript">
    function runme() {
    alert ('test');
    }
    </script>
    any ideas why the runme function doesnt run? if i direct access the file the function works. stuff like <a href="javascript:alert('test');"> works aswell.
    You can view the script in action here: http://it-leaked.com/v4test/


    thanks for the help.

    PS: Should i change the topic name?

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
  •