adding data without reloading, and not using frames...

August 11th, 2005, 10:46 pm

ok I know most chat programs that html and server based use a simple hidden iframe that fetches data and then sends it back to a javascript function which prints it on the page without the window having to reload itself.

What I need to know is that is there another way to do the same thing...?

Because having the iframe refresh itself to get the chat content is a drag because of the clicking sound it makes and also the fact that it is not a steady connection.

However the thing is that I would like the chat program to remain in html but just have the data feader to be different somehow...

any ideas?

August 12th, 2005, 5:20 am

you dont need to use iframe. you can use javascript to call the page you write and from there you grab the info.

one of my friend have done this and it has no problem

August 12th, 2005, 5:41 am

does this work

August 12th, 2005, 8:25 am

hmm, PHP is server side language, you have to refresh it to update your content, there is zero way around this. Java is clent side, you can use that to stream or just regrab data without a page refresh. I think PECL may have a streaming package now, not sure, haven't looked them up lately, but other then that, you should use java for this.

August 12th, 2005, 8:49 am

PECL or PERL?

August 12th, 2005, 8:50 am

and how can you call a page using javascript?

the only other way I know is a popup? how does your buddy do it exactly?

August 12th, 2005, 9:42 am

Check out Ajax http://en.wikipedia.org/wiki/AJAX.
It allows you to pull PHP content without reloading the page.

You can send a GET query to the server, and write the response into an div tag's innerHTML - or something else to this effect.

It may take some fine tuning, and there are some browser compatability issues, but it works pretty well.
There is a fairly nice tutorial here http://developer.apple.com/internet/webcontent/xmlhttpreq.html

Also check out the examples here if you want proof of the concept.
[url]http://jpspan.sourceforge.net/wiki/doku.php?id=javascript:xmlhttprequest#known_applications_:examples[/url]

August 12th, 2005, 9:49 am

PECL, I didn't mistype

August 12th, 2005, 10:03 am

k so this form of scripting is similar to actionscripts loadVars() behaviour...

August 12th, 2005, 10:46 am

AJAX is a really killer technique. I've never studied any xml, which the technique uses, but it was still incredibly simple for me to integrate the example code into my web app. I use it to call a PHP script that gets info from a database, then it easily gets printed in my html document, no problem. I strongly recommend using it if you need to print DB info or some kind of text from a file.

August 12th, 2005, 10:47 am

with the links you just provided, I tried using the XMLHttpRequest and it works amazing.

All that was needed was a few browser branching techniques and whola

August 12th, 2005, 11:00 am

In case you are interested, this is the function which I use, and have found to be pretty stable and cross browser friendly:

Code: [ Download ] [ Select ]

function execquery(query,target)
{
    var xmlhttp=false;
    /*@cc_on @*/
    /*@if (@_jscript_version >= 5)
    // JScript gives us Conditional compilation, we can cope with old IE versions.
    // and security blocked creation of the objects.
    try {
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (E) {
            xmlhttp = false;
        }
    }
    @end @*/
    if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
        xmlhttp = new XMLHttpRequest();
    }
    if (query != "") {
        xmlhttp.open("GET", query,true);
        xmlhttp.onreadystatechange=function() {
            if (xmlhttp.readyState==4) {
                document.getElementById(target).innerHTML = xmlhttp.responseText;
            }
        }
        xmlhttp.send(null);
    }
}

1. function execquery(query,target)
2. {
3.     var xmlhttp=false;
4.     /*@cc_on @*/
5.     /*@if (@_jscript_version >= 5)
6.     // JScript gives us Conditional compilation, we can cope with old IE versions.
7.     // and security blocked creation of the objects.
8.     try {
9.         xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
10.     } catch (e) {
11.         try {
12.             xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
13.         } catch (E) {
14.             xmlhttp = false;
15.         }
16.     }
17.     @end @*/
18.     if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
19.         xmlhttp = new XMLHttpRequest();
20.     }
21.     if (query != "") {
22.         xmlhttp.open("GET", query,true);
23.         xmlhttp.onreadystatechange=function() {
24.             if (xmlhttp.readyState==4) {
25.                 document.getElementById(target).innerHTML = xmlhttp.responseText;
26.             }
27.         }
28.         xmlhttp.send(null);
29.     }
30. }

You just pass it a URL to query with all the get parameters, and a target to write to.
For example,

Code: [ Download ] [ Select ]

var q = "script.php?zipcode=90210&catagory=tvshows&decade=early90s";
var target = "thedivtodisplayin";

execquery(q,target);

1. var q = "script.php?zipcode=90210&catagory=tvshows&decade=early90s";
2. var target = "thedivtodisplayin";
4. execquery(q,target);

August 24th, 2005, 6:15 pm

here is a cross browser script for the xml http

http://sarissa.sourceforge.net/doc/