I have many html files, of which one is the main html page on which I have many buttons. What I want is to load the content of one file on the main html file in the desired div tag. I dont want a single file to contain whole html text, so I want to separate the html text in different file and load only that part on button click which user clicks.
Add a comment
|
3 Answers
Please try to use this code.
<html lang="en">
<head>
<meta charset="utf-8">
<title>load index page</title>
<style>
body{ font-size: 12px; font-family: Arial; }
</style>
<script src="jquery.js"></script>
</head>
<body>
<b>Successful Response (should be blank):</b>
<div id="success"></div>
<b>Error Response:</b>
<div id="error"></div>
<script>
var browser=navigator.userAgent;
alert("ASHIk");
$("#success").load("index.php", function(response, status, xhr) {
if (status == "error") {
var msg = "Sorry but there was an error: ";
$("#error").html(msg + xhr.status + " " + xhr.statusText);
}
});
</script>
</body>
</html
answered May 21, 2014 at 9:51
Muhammad Ashikuzzaman
3,1736 gold badges32 silver badges55 bronze badges
Comments
it looks like good work for angular.js. Check this out :
Comments
You could load the new HTML file with an ajax call (using JQuery) and send the response into the relevant div.
$.ajax({
url: <YourUrl>,
type: "GET",
dataType: "html",
cache: false,
success: function (data) {
$('#TargetDiv').replaceWith($(data));
}
}
1 Comment
Nikhil
We dont have any type of server involved in this. There is a normal html page and which should open when the user clicks.