Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

How to refresh DIV not all page?

Posted on 2009-05-13
4
Medium Priority
?
557 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
  • 2
3 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

[Webinar] Database Backup and Recovery

Does your company store data on premises, off site, in the cloud, or a combination of these? If you answered “yes”, you need a data backup recovery plan that fits each and every platform. Watch now as as Percona teaches us how to build agile data backup recovery plan.

Question has a verified solution.

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

Without even knowing it, most of us are using web applications on a daily basis.  In fact, Gmail and Yahoo email, Twitter, Facebook, and eBay are used by most of us daily—and they are web applications. We generally confuse these web applications to…
The first step to building an amazing About page is to figure out what you want the page to say about your company. You then must grab the attention of the reader, boast a bit, tell a story and let others brag about you. With a little bit of thought…
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…
Suggested Courses

569 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