JS: Function not working

For some weird reason my function isn't working and I was wondering what im missing, I'll try to explain.

When you first load the website it needs to load a function, after this it will start loading into divs.

Code in my div (Also tried: body onload or in the header)

<script type="text/javascript">
<?php  
if(empty($write_page['1'])) { 
?>
loadthisframe(home);
<?php 
}             
else         
{ 
?>
var <?php echo $write_page['1']; ?>;
loadthisframe(<?php echo $write_page['1']; ?>);
<?php
} 
?>
</script>

So i stripped down the complete function to test:

function loadthisframe(loadthisframe) {
    console.log("load page");
}

The code above will display something like:

<script type="text/javascript">
loadthisframe(home);
</script>

or

<script type="text/javascript">
var contact;
loadthisframe(contact);
</script>

This is based on what page you are at,



But it doesn't work, when I delete the "var <?php echo $write_page; ?>;"

I get the following: "ReferenceError: home is not defined"

The rest of the website works fine, its not that its waiting for jquery or so..



When i click on a existing tab, which does the same (kinda), works fine.

$('#tabhome').bind('click', function(event) {
var home = "home";	
loadpageframe(home);
window.history.pushState("object or string", "Title", "/");
});

I also tried replacing loadthisframe with loadpageframe but there is where the problem started so i'm trying to strip down till i find the issue.






Update 11:42, I updated the load code to:

<script type="text/javascript">
window.onload = function(){
<?php  
if(empty($write_page['1'])) { 
?>
var home = "home";
loadthisframe(home);
<?php 
} 			
else 		
{ 
?>
var <?php echo $write_page['1']; ?> = "<?php echo $write_page['1']; ?>";
loadthisframe(<?php echo $write_page['1']; ?>);
<?php
} 
?>
}
</script>

and the function to:

function loadthisframe(paged) {
	var framed = paged;
	console.log("loading page "+framed);
	console.log("starting injecting frame "+framed);
	loadpageframe(framed);
}

console.log output:

ReferenceError: loadpageframe is not defined main.data.js:174:1
"loading page home" main.data.js:172:1
"starting injecting framehome" main.data.js:173:1


So I replaced 'loadpageframe' by 'loadpageframe' for testing, giving output: ReferenceError: loadpageframe is not defined




this is my loadpageframe:

function loadpageframe(loadframe) {
	var paged = loadframe;
	console.log("/html/"+paged+".php");
	$.ajax({
        type: "GET",
        url: "/html/"+paged+".php",
        cache: false,
		beforeSend: function() { 
			$("#wait").css("display", "block");
			$('#dataincontent').html(" ");  
			if(paged == "videos") {
			$("#tabblog").removeClass('ui-btn-active');
			$("#tabprojects").removeClass('ui-btn-active');				
			$("#tabvideos").addClass('ui-btn-active');
			} else if(paged == "blog") {
			$("#tabblog").addClass('ui-btn-active');
			$("#tabprojects").removeClass('ui-btn-active');				
			$("#tabvideos").removeClass('ui-btn-active');
			} else if(paged == "projects") {
			$("#tabblog").removeClass('ui-btn-active');
			$("#tabprojects").addClass('ui-btn-active');				
			$("#tabvideos").removeClass('ui-btn-active');
			}
			else
			{
			$("#tabblog").removeClass('ui-btn-active');
			$("#tabprojects").removeClass('ui-btn-active');				
			$("#tabvideos").removeClass('ui-btn-active');
			}
		},
        success: function (data) { 
			$('#dataincontent').html(data); 
		},
        error: function (data) { 
			$('#contentdata').html("ERROR"); 
		},
		complete: function() { 
			$("#wait").css("display", "none"); 
			$("#dataincontent").css("display", "inline-block"); 
		}
    });
}

FIXED!

Moved the code to another .js file for some reason it doesn't accept to be after onload which ofc is logic -_-