471,889 Members | 2,240 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,889 software developers and data experts.

Loading HTML pages inside <div id="x"></div>

Does anybody know how can I load an html page inside a <div</div>
where the content gets update on the onclick even of anchor <a href=>
</a>?

I googled around and followed some links pointing me that it is
possible to use javascript combined with CSS for doing this? Any
ideas?

Chakra

Jun 6 '07 #1
5 38781
On 6 Jun, 17:36, chakradhari.ash...@gmail.com wrote:
Does anybody know how can I load an html page inside a <div</div>
where the content gets update on the onclick even of anchor <a href=>
</a>?

I googled around and followed some links pointing me that it is
possible to use javascript combined with CSS for doing this? Any
ideas?

Chakra
You want to put a complete page inside a div element?
Normally you'd use the innerHTML method to change text inside a div.

Jun 6 '07 #2
In this case, use xmlhttprequest. Give to the div an ID first, then...

var req = new XMLHttpRequest();
req.open("GET", "page.html", false);
req.send(null);

var page = req.responseText;

document.getElementById("your div").innerHTML = page.

It's done.
Jun 6 '07 #3
ch****************@gmail.com said the following on 6/6/2007 12:36 PM:
Does anybody know how can I load an html page inside a <div</div>
where the content gets update on the onclick even of anchor <a href=>
</a>?
Yes, I know how.
I googled around and followed some links pointing me that it is
possible to use javascript combined with CSS for doing this?
Yes, it is possible to do with javascript.
Any ideas?
I have lots of ideas, some of which are not fit to be posted to a family
oriented group.

Try reading the FAQ. The URL is in my signature.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Jun 6 '07 #4
Dear Moyzes,

Thanks a lot! It worked.

my link looks like:

<li><a href="" onclick="loadNewPage('indexp.html'); return false;"
id="current"></a></li>

function loadNewPage(temp) {
var req = new XMLHttpRequest();
req.open("GET", temp, false);
req.send(null);
var page = req.responseText;
document.getElementById("rcol").innerHTML = page;
}

On Jun 6, 5:00 pm, Moyzes <moy...@gmail.comwrote:
In this case, use xmlhttprequest. Give to the div an ID first, then...

var req = new XMLHttpRequest();
req.open("GET", "page.html", false);
req.send(null);

var page = req.responseText;

document.getElementById("your div").innerHTML = page.

It's done.

Jun 7 '07 #5
On Jun 6, 8:52 pm, Randy Webb <HikksNotAtH...@aol.comwrote:
chakradhari.ash...@gmail.com said the following on 6/6/2007 12:36 PM:
Does anybody know how can I load an html page inside a <div</div>
where the content gets update on the onclick even of anchor <a href=>
</a>?

Yes, I know how.
I googled around and followed some links pointing me that it is
possible to use javascript combined with CSS for doing this?

Yes, it is possible to do with javascript.
Any ideas?

I have lots of ideas, some of which are not fit to be posted to a family
oriented group.

Try reading the FAQ. The URL is in my signature.
Thanks! Sorry for the generic question. But before posting it, I did
try the ways known to my limited knowledge of this field, and when I
could not do it, I thought of asking the requesting the experts!

In any case, your signature was useful.

Jun 7 '07 #6

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

2 posts views Thread by David | last post: by
16 posts views Thread by rik | last post: by
3 posts views Thread by Jim in Arizona | last post: by
5 posts views Thread by Alex Maghen | last post: by
reply views Thread by YellowAndGreen | last post: by
reply views Thread by zermasroor | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.