View Single Post
Old 09-22-2009, 12:58 PM   PM User | #1
phoenixrip
New to the CF scene

 
Join Date: Sep 2009
Posts: 2
Thanks: 0
Thanked 0 Times in 0 Posts
phoenixrip is an unknown quantity at this point
Why are these two conflicting?

Heya guys. I'm pretty stuck, but fairly certain there is an obvious, simple solution to this:

I have two different types of ajax call in my document, both use the same method, but each is reloading and calling a different amount of content, depending on the ID of a link that is clicked, so one link ID triggers reloading of just the content, and the other triggers reloading of the content and the navigation as well.

They both work individually, but when both are loaded into the document, on the one that is loaded last will work.

can any one help me figure out what is conflicting between the two?

Here is the first piece of code, for just the div#content being reloaded:
Code:
$j(document).ready(function() {
					   
	$j('#content').wrap('<div id="content-wrapper"></div>');
						   
	function pageload(hash) {
		if(hash.substr(hash.length-3, hash.length) == "php") {
			$j("#content-wrapper").load(hash.substr(0,hash.length-3) + ".php #content",'',function(){
				$j('#content-wrapper').slideFadeShow(1000);
				$j('#load').fadeOut('normal');												   
			});
	}
		else if(hash.substr(hash.length-3, hash.length) == "htm") {
				$j("#content-wrapper").load(hash.substr(0,hash.length-3) + ".htm #content",'',function(){
					$j('#content-wrapper').slideFadeShow(1000);
					$j('#load').fadeOut('normal');												   
				});
		}
		
		else if(hash) {
			$j("#content-wrapper").load(hash + ".html #content",'',function(){
			
				$j('#content-wrapper').slideFadeShow(1000);
				$j('#load').fadeOut('normal');												   
			});
		} 
	}
	
	$j.historyInit(pageload);			   
	
	$j('a.ajaxcontentlink').livequery('click',function(){
								  
		var hash = $j(this).attr('href');
		hash = hash.replace(/^.*#/, '');
		
		if (hash.substr(hash.length-3, hash.length) == "php") {
			hash = hash.substr(0, hash.length-4) + "php";
		}
		else if (hash.substr(hash.length-3, hash.length) == "htm") {
			hash = hash.substr(0, hash.length-4) + "htm";
		}
		else {
			hash = hash.substr(0,hash.length-5);
		}
		$j('#content-wrapper').slideFadeHide(1000,function(){$j.historyLoad(hash)});
		$j('#load').remove();
		$j('#wrapper').append('<div id="load">LOADING<div id="loaderimage"></div></div>');
		$j('#load').fadeIn('normal');
		return false;
		
	});
	
});

Here is the second piece, which should reload everything in div#contentwithnav

Code:
$j(document).ready(function() {
					   
	$j('#contentwithnav').wrap('<div id="content-wrapper-withnav"></div>');
						   
	function pageloadwithnav(hashwithnav) {
		if(hashwithnav.substr(hashwithnav.length-3, hashwithnav.length) == "php") {
			$j("#content-wrapper-withnav").load(hashwithnav.substr(0,hashwithnav.length-3) + ".php #contentwithnav",'',function(){
				$j('#content-wrapper-withnav').slideFadeShow(1000);
				$j('#load').fadeOut('normal');												   
			});
	}
		else if(hashwithnav.substr(hashwithnav.length-3, hashwithnav.length) == "htm") {
				$j("#content-wrapper-withnav").load(hashwithnav.substr(0,hashwithnav.length-3) + ".htm #contentwithnav",'',function(){
					$j('#content-wrapper-withnav').slideFadeShow(1000);
					$j('#load').fadeOut('normal');												   
				});
		}
		
		else if(hashwithnav) {
			$j("#content-wrapper-withnav").load(hashwithnav + ".html #contentwithnav",'',function(){
				$j('#content-wrapper-withnav').slideFadeShow(1000);
				$j('#load').fadeOut('normal');												   
			});
		} 
	}
	
	$j.historyInit(pageloadwithnav);			   
	
	$j('a.ajaxandnavigationlink').livequery('click',function(){
								  
		var hashwithnav = $j(this).attr('href');
		hashwithnav = hashwithnav.replace(/^.*#/, '');
		
		if (hashwithnav.substr(hashwithnav.length-3, hashwithnav.length) == "php") {
			hashwithnav = hashwithnav.substr(0, hashwithnav.length-4) + "php";
		}
		else if (hashwithnav.substr(hashwithnav.length-3, hashwithnav.length) == "htm") {
			hashwithnav = hashwithnav.substr(0, hashwithnav.length-4) + "htm";
		}
		else {
			hashwithnav = hashwithnav.substr(0,hashwithnav.length-5);
		}
		$j('#content-wrapper-withnav').slideFadeHide(1000,function(){$j.historyLoad(hashwithnav)});
		$j('#load').remove();
		$j('#wrapper').append('<div id="load">LOADING<div id="loaderimage"></div></div>');
		$j('#load').fadeIn('normal');
		return false;
		
	});
	
});
for those wondering, there are custom effects setup like this:

Code:
jQuery.fn.slideFadeHide = function(speed, easing, callback) {
  return this.animate({opacity: 'hide', height: 'hide'}, speed, easing, callback);  
};

jQuery.fn.slideFadeShow = function(speed, easing, callback) {
  return this.animate({opacity: 'show', height: 'show'}, speed, easing, callback);  
};
Any help would be greatly appreciated, and an answer could be rewarded with a paypal donation, as this is driving me MENTAL

Cheers

Robbie
phoenixrip is offline   Reply With Quote