PDA

View Full Version : Need to load External page inside of #myelement



FacoT
01-17-2009, 02:00 AM
Hi I need to call another page and display it in a <div>
using jQuery with no onclick functions or anything
just when the page loads display another page inside #mybox
this should be a very small code i am sure but after reading all of the documentation
everywhere i still can't get it to work so i am using an <iframe>.
Thanks...FacoT...:cool:

FacoT
01-17-2009, 02:16 AM
So far I know this much
but it is not helping me

/*.............................................................
<script type=text/javascript>

$.ajax({
type: ?text/html?
url: "myPage.html",
data: {name : ?html ? },
success: function( ?display? ?.append ? ){
alert( " ?hey i dont want any alert? ");
}
});

</script>
..............................................................*/

FacoT
01-20-2009, 03:07 PM
Need to load External page inside of #myelement

Hi I need to call another page and display it in a <div>
using jQuery with no onclick functions or anything
just when the page loads display another page inside #mybox
this should be a very small code i am sure but after reading all of the documentation
everywhere i still can't get it to work so i am using an <iframe>.
Thanks...FacoT...

jscheuer1
01-20-2009, 05:12 PM
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$.ajax({
url: "test.htm",
cache: false,
success: function(html){
$("#results").append(html);
}
});
});
</script>
</head>
<body>
<div id="results">

</div>
</body>
</html>

Or even more simply:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$("#results").load("test.htm");
});
</script>
</head>
<body>
<div id="results">

</div>
</body>
</html>

FacoT
01-21-2009, 02:22 PM
I tried this and other variations but couldn't get that to work.
Maybe it's just me.
Did you find out anything more about this piece of code?
..................................................................................
$.ajax({
url: "test.htm",
cache: false,
success: function(html){
$("#results").append(html);
}
});
});
................................................

jscheuer1
01-21-2009, 03:14 PM
I'm not sure what you are asking at this point. Both of my demo pages are working examples. The code in your most recent post will not work unless there is an element with the id 'results' which has been parsed by the browser before it runs. It also requires a page named 'test.htm' to be in the same folder as the page using the code.

Perhaps a key here is the use in both of my examples of the containing function:


$(function(){
ajax code goes here
});

This is shorthand for the jQuery document ready function, which works like onload, giving the browser the chance to parse the 'results' division before attempting to populate it.

For more on the $.ajax method itself, see:

http://docs.jquery.com/Ajax/jQuery.ajax

FacoT
01-21-2009, 04:38 PM
Thanks for replying to my call for help, It might just be my browser.
I have read all the documentation it's probably just me
Thanks. - Gary

jscheuer1
01-21-2009, 05:33 PM
For a working demo see:

http://home.comcast.net/~jscheuer1/side/jq_ajax/ajax.htm

It might be your server. If you want more help:

Please post a link to the page on your site that contains the problematic code so we can check it out.

FacoT
04-03-2009, 12:13 AM
This is still troubling me, i had left it alone but now i'm back.
I can't figure out how to replace this page refreshing <iframe> with ajax &/or jQ.
Your help would be much appreciated.

jscheuer1
04-03-2009, 03:01 AM
AJAX will not fetch remote pages (I assume you mean from another domain, I do). You can use iframe, but only to display the page itself within an iframe on your page. And that assumes that this remote page has no 'frame busting' code on it. You cannot interact with a remote page in an iframe to say - get its content for import, or even its dimensions for resizing the iframe.

FacoT
04-03-2009, 03:25 AM
I replaced it with a widget. I am looking at some json right now but it's harsh for a novice like me, the author of the remote page created it to be shown in an iframe so it even adopts the css styles & the background is transparent inside the <div> which is cool but... it auto refreshes the page.
Any ideas how to stop a page refresh with javascript or meta?