.live method kills ajax

JavaScript
1

Here is my issue. I have a php file… I click on the link, ajax generates a lightbox, I close the lightbox, then I click the link again and I am redirected to a new php file rather than loading the ajax.

Here is my lightbox JS. Should this cause a conflict?


$(function() {
      $('div#lightBoxCloseButton').live('click', function() {
        $('div.lightBoxCon').hide();
        $('div.lightBoxCover').hide();
      });
});
2

Something is wrong with your close function. We have to see the close function code in order to diagnose what the problem is. Hehe.

P.S. Does the open lightbox link disappear once the lightbox is open? If it doesn’t then try clicking the lightbox button once the lightbox is already open, and see if it redirects you. If it does redirect you, then we know there is a problem with the open function.

3

I can’t click outside of the lightbox when it is open…

Here is the ajax. I’m assuming you are referring to the close function of the ajax code.

<script type="text/javascript">
function loadXMLDoc(url,cfunc)

{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject(“Microsoft.XMLHTTP”);
}
xmlhttp.onreadystatechange=cfunc;
xmlhttp.open(“GET”,url,true);
xmlhttp.send();
}
window.onload = function (){
document.getElementById(‘personalPartners’).onclick = function(){
loadXMLDoc(“partners.php?u=<?php echo $username ; ?>&ajax=true”,function(){
if(xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.body.innerHTML = document.body.innerHTML + xmlhttp.responseText ;
}
})
return false}
}
</script>

4

This isn’t tested, but perhaps using JQuery native methods for the onload callback and ajax will solve the issue.


$(document).ready(function() {

	$('#personalPartners').click(function() {

		$.ajax({
			url: 'partners.php?u=<?php echo $username ; ?>&ajax=true'
		
			,dataType:'html'
		
			,success:function(data,status,xhr) {
				$('body').html(data);
			}
		
			,error:function(xhr,status,error) {
				alert('An error has occurred with the request.');
			}
		});

	});

});

If your using JQuery you might as well take full advantage of what it has to offer.

Edit:

Is JavaScript included in the AJAX response? If so than you need to manually eval() the contents of every script tag. innerHTML does not execute JavaScript. However, JQuery html() does.

5

No javascript is included in the AJAX response. You Jquery code didn’t seem to work for me. I was getting the error message / alert.