This is my .load script that loads my page into the div tag.
What am not able to do is when is load my php form into the div tag... And i hit the submit button it navigates to another page.The idea here is to load all the pages into one page.Please how can i achieve this.
Any help please.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ministry of Health Online Application||Personal Information</title>
<script language="JavaScript" src="gen_validatorv31.js" type="text/javascript"></script>
<script src="js/jquery-1.2.3.pack.js"></script>
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/tutorial.js"></script>
<!-- Our JS Functions -->
<style type="text/css">
<!--
@import url("loginmodule.css");
body {
background-image: url(images/back.jpg);
}
-->
</style>
<link href="footer.css" rel="stylesheet" type="text/css" />
<script>
$(document).ready(function(){
// load index page when the page loads
$("#dvloader").show();
$("#response").load("personal.php",null, function(){ $("#dvloader").hide(); });
return false;
$("post").click(function(){
// load home page on click
$("#response").load("insert+new+personal.php");
});
$("#about").click(function(){
// load about page on click
$("#response").load("about.html");
});
$("#contact").click(function(){
// load contact form onclick
$("#response").load("contact.html");
});
});
</script>
</head>
<body>
<p>
</p>
<p> </p>
<p> </p>
<!--DWLayoutTable-->
<body>
<div style="position: relative; top: 200px; left: 100px" id="dvloader"><img src="images/ajaxLoad.gif" align="center"/>Loading Please Wait...</div>
<table width="1254" border="0" cellpadding="0" cellspacing="0">
<div id="response" ></div>
</table>
</p>
</body>
</html>