?
Solved

How to refresh DIV not all page?

Posted on 2009-05-13
4
Medium Priority
?
553 Views
Last Modified: 2012-06-27
Hi all,

i need some help. I have a code that basicly its divided in two parts, left part is a streaming and right part its indicators (perl script inside the same page), this part needs to be refreshed all 2seconds, to give real-time statistics, but i dont want to reload the stream part.

its just one page examples.pl?refer that i call, and this gives the output in html. how can i do this?

Tks a lot people,
0
Comment
Question by:mpc650
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
4 Comments
 
LVL 40

Accepted Solution

by:
mrjoltcola earned 2000 total points
ID: 24379886
Use AJAX to do this.

I use JQuery API, as it provides a higher level api / notation for this. Here is a way to do in JQuery.

You'll need to implement a way to call your script just to get the content you want. Below I implemented it as a different Perl script.

Get JQuery from jquery.com, its 1 file.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<script type="text/javascript" src="/js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  refreshDiv();
});
 
function refreshDiv() {
  $("#myDiv").load("/webapp/getdata.pl", function() { setTimeout("refreshDiv();", 2000); } );
}
</script>
</head>
 
<body>
<div id="myDiv">
</div>
</body>
</html>

Open in new window

0
 
LVL 39

Expert Comment

by:Adam314
ID: 24397871
I agree AJAX is the best way.  I've not used JQuery before, but didn't find the basic AJAX command to difficult to deal with.  Here is a very good tutorial on AJAX:
http://www.w3schools.com/ajax/default.asp
0
 
LVL 40

Expert Comment

by:mrjoltcola
ID: 24398345
@Adam: JQuery is nice and lightweight, and gives you sort of a functional syntax to deal with the DOM, as opposed to some of the other imperative style approaches. You should love JQuery since you are a Perl pro, you can do things like $.each(...) to traverse the DOM and call closures / functions.

For full AJAX development, there are more heavyweight libs that bring GUI toolkit with them, such as ExtJS, but its overkill for someone that just wants to do simple HTML / DIV work.
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Originally, this post was published on Monitis Blog, you can check it here . Websites are getting bigger and more complicated by the day. Video, images and custom fonts are all great for showcasing your product or service. But the price to pay in…
Q&A with Course Creator, Mark Lassoff, on the importance of HTML5 in the career of a modern-day developer.
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
Six Sigma Control Plans
Suggested Courses

800 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question