Go Back   CodingForums.com > :: Client side development > JavaScript programming

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 12-20-2004, 12:55 PM   PM User | #1
chump2877
Senior Coder

 
chump2877's Avatar
 
Join Date: Dec 2004
Location: the U.S. of freakin' A.
Posts: 2,530
Thanks: 15
Thanked 128 Times in 121 Posts
chump2877 is on a distinguished road
loading more HTML to existing page w/o page reload...

First, please bear with me, I'm very much a novice at javascript coding...I'm better with the php..

Anyway, could someone here provide me with an example of a script that loads additional HTML page elements to an existing HTML page without having the whole page reload?...If you give me an example, I'm sure I could figure out how to apply it to my web page (I'm not totally inept... )

Thanks, R.J.
chump2877 is offline   Reply With Quote
Old 12-20-2004, 01:12 PM   PM User | #2
chump2877
Senior Coder

 
chump2877's Avatar
 
Join Date: Dec 2004
Location: the U.S. of freakin' A.
Posts: 2,530
Thanks: 15
Thanked 128 Times in 121 Posts
chump2877 is on a distinguished road
Nevermind...I think I can do the same thing with DHTML...if anyone thinks otherwise, let me know...thanks

R.J.
chump2877 is offline   Reply With Quote
Old 12-20-2004, 03:02 PM   PM User | #3
jbot
Senior Coder

 
Join Date: Feb 2004
Location: Edinburgh
Posts: 1,352
Thanks: 0
Thanked 0 Times in 0 Posts
jbot is an unknown quantity at this point
Quote:
Originally Posted by chump2877
Anyway, could someone here provide me with an example of a script that loads additional HTML page elements to an existing HTML page without having the whole page reload?
if you're talking about receiving more info from the server, then you wanna check out Javascript Remote Scripting (JSRS), XMLHttpRequest or XMLHttp (ActiveX), all of which can be set up to query a remote application and return data which is then used by DHTML to update the page.
__________________
*keep it simple (TM)
jbot is offline   Reply With Quote
Old 12-20-2004, 06:55 PM   PM User | #4
NEExt
New Coder

 
Join Date: May 2004
Posts: 70
Thanks: 0
Thanked 0 Times in 0 Posts
NEExt is an unknown quantity at this point
Do you actually need to go back to the server to get more HTML on a user action? Say for example on an onclick event?

Because if you don't care about going back to the server, and just want to display (and/or hide) elements based upon user clicks - then this may help you out a bit. I use this to display information about our Staff (names, pics, phone numbers, pagers, etc). User clicks a name, and the relevent portion unhides. Looks somewhat like a frameset - without being a frame set. Works really nicely with a full CSS styled page.

Code:
<html><head>

<script type="text/javascript">
function unHide(areaName) {
  var el = document.getElementById(areaName);
  var ar = document.getElementsByTagName("div");
  for (var i=0; i<ar.length; i++) {
    if (ar[i].className == "hidden") {
      ar[i].style.display = "none";
    }
  }
  el.style.display = "block";
}
</script></head><body>

<a href="#" onclick="unHide('bill')">Bill</a>
<a href="#" onclick="unHide('mike')">Mike</a>
<a href="#" onclick="unHide('peggy')">Peggy</a>

<div class="hidden">
<h1>THIS SHOWS WHEN PAGE LOADS</h1>
</div>

<div class="hidden" id="bill" style="display:none;">
<h1>ThIS IS BILLS INFO</h1>
</div>

<div class="hidden" id="mike" style="display:none;">
<h1>THIS IS MIKES INFO</h1>
</div>

</body>
</html>
NEExt is offline   Reply With Quote
Old 12-21-2004, 09:30 AM   PM User | #5
jbot
Senior Coder

 
Join Date: Feb 2004
Location: Edinburgh
Posts: 1,352
Thanks: 0
Thanked 0 Times in 0 Posts
jbot is an unknown quantity at this point
Quote:
Originally Posted by NEExt
Do you actually need to go back to the server to get more HTML on a user action?
well, that's what we don't know in relation to the context of his question. if it doesn't involve any dynamically generated data, then he doesn't need to and can merely hide and show sections. but bear in mind, that users without JS will not see the other info and users with text browsers or screen readers will always see the other text.
__________________
*keep it simple (TM)
jbot is offline   Reply With Quote
Old 12-21-2004, 07:50 PM   PM User | #6
NEExt
New Coder

 
Join Date: May 2004
Posts: 70
Thanks: 0
Thanked 0 Times in 0 Posts
NEExt is an unknown quantity at this point
Quote:
users without JS will not see the other info
You're right. Luckily I design for an intranet that locks all custom browser features. JS is always enabled where I play.

Quote:
text browsers or screen readers will always see the other text.
Another good thing. It's designed properly to make perfect sense to the few JAWS users we have here.

In any case.. I was just offering a potential solution to his problem.
NEExt is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 11:26 AM.


Advertisement
Log in to turn off these ads.