Jump to content

Javascript not working in included file?


rockinaway

Recommended Posts

I have a main page, home.php. This file then has content dynamically loaded using AJAX based on which link is clicked. So one link loads content from info.php.

 

I have included my Javascript file (i'm using jQuery) in home.php. However, when I use some form of Javascript e.g. "<a onclick="contact()">Contact</a>", in info.php, it doesn't work. It says that the function in undefined even though it is clearly stated in the main Javascript file included in home.php

 

What do I need to do? Include it individually again? :s

Link to comment
https://forums.phpfreaks.com/topic/251194-javascript-not-working-in-included-file/
Share on other sites

well it's difficult to post the code as there is code in a huge number of files. I have done some troubleshooting and have made some conclusions. I will talk about my problem as simply as possible.

 

I have a main page, main.php. This file has a header.php included which has the javascript file, jquery_functions.js, included in the <head> tag.

 

Then in main.php, I have a div called 'main_div'. This DIV is empty to begin with. When a link is clicked, it triggers a function in jquery_functions.js which causes main_div to be filled with content. This new content, produced from an AJAX response to another file, now contains some JS functions which are stored in jquery_functions.js.

 

However, when clicking these new functions, NOTHING happens. I get that the function is undefined although it is clearly defined in my .js file.

 

My jquery file is below, a lot of irrelevant information really, the last bit is where the major AJAX changes occur (the changing hash section).

 


$(document).ready(function () {

// Set a few vars
var webroot = 'http://www.etcworld.co.uk/sn/';
var dir = '/sn/';

///////////////////////////////////////////////
/// Hover and change the images in the header
$(".msg").hover(
  	function(){this.src = this.src.replace(""+webroot+"theme/img/header_message_img.png",""+webroot+"theme/img/header_message_img_h.png");},
  	function(){this.src = this.src.replace(""+webroot+"theme/img/header_message_img_h.png",""+webroot+"theme/img/header_message_img.png");
});

$(".stream").hover(
  	function(){this.src = this.src.replace(""+webroot+"theme/img/header_stream_img.png",""+webroot+"theme/img/header_stream_img_h.png");},
  	function(){this.src = this.src.replace(""+webroot+"theme/img/header_stream_img_h.png",""+webroot+"theme/img/header_stream_img.png");
});
///
///////////////////////////////////////////////
    
    ///////////////////////////////////////////////
    /// Mini thought updates - clicking functions
    $('#cancel_mini_thought').click(function() {
    	$('#thought_form_div').hide();
    	$('#mini_thought_div').show();
    	return false;
    });
    
     
$('#thought').click(function(e) {
	// 
	e.stopPropagation();
	$('#mini_thought_div').hide();
	$('#thought_form_div').show();

	// Focus onto the text field
	$('#mini_thought').focus();
});

// When we click anywhere else
$(document).click(function(){

	$('#thought_form_div').hide();
	$('#mini_thought_div').show();
});
    ///
    ///////////////////////////////////////////////
    
    ///////////////////////////////////////////////
    /// Mini thought is submitted
$('#thought_form_div').keydown(function(event) {
	if(event.keyCode == 13) {

	  // Stop the normal submit	
	  event.preventDefault();
	  
	  // The thought submitted
	  var mini_thought = encodeURIComponent($('#mini_thought').val());
	  
	  // Send the request
		$.ajax({
			url: 'post.php',
			 data: 'mini_thought='+mini_thought,
			type: 'post',
			success: function (thought) {

				// Show the new thought
				$('#mini_thought_div').html(thought);

				// Show and hide
				$('#mini_thought_div').show();
    				$('#thought_form_div').hide();
			}
		});
	  
	  // Don't submit
	  return false;
	}
  });
     ///
 //////////////////////////////////////////////

 //////////////////////////////////////////////
 /// Mini buttons at the top

	$("#thought_update_button").click(function() {

		$("#header_mini_buttons #photo_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #photo_update_button").addClass("mini_button");
		$("#header_mini_buttons #video_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #video_update_button").addClass("mini_button");
		$("#header_mini_buttons #post_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #post_update_button").addClass("mini_button");
		$("#thought_update_button").removeClass("mini_button");
		$("#thought_update_button").addClass("mini_button_clicked");


		$("#update_boxes .update_box").css("display","none");
		$("#update_boxes #thought_update").css("display","block");

		return false;
	});


	$("#photo_update_button").click(function() {

		$("#header_mini_buttons #thought_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #thought_update_button").addClass("mini_button");
		$("#header_mini_buttons #video_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #video_update_button").addClass("mini_button");
		$("#header_mini_buttons #post_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #post_update_button").addClass("mini_button");
		$("#photo_update_button").removeClass("mini_button");
		$("#photo_update_button").addClass("mini_button_clicked");


		$("#update_boxes .update_box").css("display","none");
		$("#update_boxes #photo_update").css("display","block");

		return false;
	});

	$("#video_update_button").click(function() {

		$("#header_mini_buttons #photo_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #photo_update_button").addClass("mini_button");
		$("#header_mini_buttons #thought_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #thought_update_button").addClass("mini_button");
		$("#header_mini_buttons #post_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #post_update_button").addClass("mini_button");
		$("#video_update_button").removeClass("mini_button");
		$("#video_update_button").addClass("mini_button_clicked");


		$("#update_boxes .update_box").css("display","none");
		$("#update_boxes #video_update").css("display","block");

		return false;
	});

	$("#post_update_button").click(function() {

		$("#header_mini_buttons #photo_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #photo_update_button").addClass("mini_button");
		$("#header_mini_buttons #video_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #video_update_button").addClass("mini_button");
		$("#header_mini_buttons #thought_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #thought_update_button").addClass("mini_button");
		$("#post_update_button").removeClass("mini_button");
		$("#post_update_button").addClass("mini_button_clicked");

		$("#update_boxes .update_box").css("display","none");
		$("#update_boxes #post_update").css("display","block");

		/*if ($("#post_update").is(":visible")) 
		{
			$('#post_update').hide();
		}
		else 
		{

			$('#post_update').show();
			$('#thought_update').hide();
			$('#photo_update').hide();
			$('#video_update').hide();
		}*/

		return false;
	});

	$("#thought_update").click(function(event) {
		  event.stopPropagation();
	});

	$("#photo_update").click(function(event) {
		  event.stopPropagation();
	});

	$("#post_update").click(function(event) {
		  event.stopPropagation();
	});

	$("#video_update").click(function(event) {
		  event.stopPropagation();
	});


	$(document).click(function(){
		$("#update_boxes .update_box").css("display","none");
		$("#header_mini_buttons #photo_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #photo_update_button").addClass("mini_button");
		$("#header_mini_buttons #video_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #video_update_button").addClass("mini_button");
		$("#header_mini_buttons #thought_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #thought_update_button").addClass("mini_button");

		$("#header_mini_buttons #post_update_button").removeClass("mini_button_clicked");
		$("#header_mini_buttons #post_update_button").addClass("mini_button");

	});
 ///
 //////////////////////////////////////////////


$.extend({
	  getUrlVars: function(){
		var vars = [], hash;
		var hashes = window.location.search.slice(window.location.search.indexOf('?') + 1).split('&');
		for(var i = 0; i < hashes.length; i++)
		{
		  hash = hashes[i].split('=');
		  vars.push(hash[0]);
		  vars[hash[0]] = hash[1];
		}
		return vars;
	  },
	  geturlvar: function(name){
		return $.getUrlVars()[name];
	  },
	  
	  getUrlHashes: function(){
		var vars = [], hash;
		var hashes = window.location.hash.slice(window.location.hash.indexOf('#') + 1).split('&');
		for(var i = 0; i < hashes.length; i++)
		{
		  hash = hashes[i].split('=');
		  vars.push(hash[0]);
		  vars[hash[0]] = hash[1];
		}
		return vars;
	  },
	  geturlhash: function(name){
		return $.getUrlHashes()[name];
	  }
});


var get = $.geturlvar;
var hash = $.geturlhash;

 //////////////////////////////////////////////
 /// Changing and hashing the profile tabs

  		// Roll tab has been clicked 
	$("#profile_link_stream").click(function() {
		window.location.hash = "#s=stream";

		// Need to force the check as the hash doesn't change on reclick
		$(window).trigger('hashchange');
	});

	// Photos tab has been clicked
	$("#profile_link_photos").click(function() {
		window.location.hash = "#s=photos";

		// Need to force the check as the hash doesn't change on reclick
		$(window).trigger('hashchange');
	});

	// Videos tab has been clicked
	$("#profile_link_videos").click(function() {
		window.location.hash = "#s=videos";

		// Need to force the check as the hash doesn't change on reclick
		//$(window).trigger('hashchange');

		//$.bbq.pushState('hello=test');
	});

	// Check we are on the profile page
	if (window.location.pathname == dir+"view_profile.php")
	{

	  $(window).bind( 'hashchange', function(e) 
	  {
	  		// Get the url hash
			//var url = $.param.fragment();

			// Get the user id
			var pid = get('pid');
			var s = hash('s');

			// Show pending image
			$('#profile_main').html('<img src="theme/img/loader.gif" height="16" width="16" />');

			// Photos huh?
			if (s == "photos")
			{
				// Send the request
				$.ajax({
					url: 'view_profile_photos.php',
					type: 'post',
					success: function (msg) {

						$("#profile_main").html(msg);
					}
				});
			}
			// Oh videos
			else if (s == "videos")
			{
				// Send the request
				$.ajax({
					url: 'view_profile_videos.php',
					type: 'post',
					success: function (msg) {

						$("#profile_main").html(msg);
					}
				});
			}
			// Stream it is.. 
			else if (s == "stream" || s == '')
			{
				// Send the request
				$.ajax({
					url: 'view_profile_stream.php',
					type: 'post',
					data: 'pid='+pid,
					success: function (msg) {

						$("#profile_main").html(msg);

					}
				});
			}
		})
	  
	  	// Trigger the event
	  	$(window).trigger('hashchange');
	 }
///
////////////////////////////////////////////////////////

////////////////////////////////////////////////////////
///		Submit a new thought
$("#thought_post_submit").click(function() {

	// Disable the button to stop more submissions
	$('#thought_post_submit').attr("disabled", true);

	// The thought submitted
	var thought = encodeURIComponent($('#thought_post').val());
	  
	// Send the request
	$.ajax({
		url: 'post.php',
		data: 'thought='+thought,
		type: 'post',
		success: function (msg) {

			// Do this is we are on the profile page!!!
			//
			//
			//

			//$("#profile_main").prepend(msg);

			//
			//
			//
			///////////

			// Enable the button
			$('#thought_post_submit').attr("disabled", false);

			// Clear the value of thought post
			$('#thought_post').val('');

			// Show pending image
			$('#mini_thought_div').html('<img src="theme/img/loader.gif" height="16" width="16" />');

			// Update mini thought
			$("#mini_thought_div").html(msg);

			// Show pending image
			$('#thought_success').html('<img src="theme/img/loader.gif" height="16" width="16" />');

			// Show the success message
			$('#thought_success').fadeIn("slow").html('Success').fadeOut(1500); 
		}
	});

	// Prevent the normal action
	return false;
});
///
//////////////////////////////////////////////////////




});

 

 

  • 1 year later...

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.