Re: Controlling Javascript from server side

Aki Niimura wrote:

I want control a hardware device using a Web browser.
I created a page which has a form containing all necessary INPUTs.
By clicking a button, all current settings are sent to the server side
(using POST or GET) so that the server can interact with the hardware,
which is under the server's control.

Now, in some cases, I want to update the INPUT (w/ readonly) with the
data from the hardware, such as a status value.
Most primitive approach is creating a new page with new value to the
INPUT, where I want to show the value.

But that is not quite efficient as the page appearance won't change
except the contents of the INPUT.

As Javascript can make any change to the HTML page (at client's side)
that is currently being displayed, it is more straight forward if the
server can send a set of Javascript commands to the web server so that
it can just update the display contents rather than refreshing
everything.

I thought such scheme was already available, but so far, I don't see
anything usable.
The Web server is not a commercial one but a custom Web server
(written in Python) so that I want to keep the scheme as simple as
possible. I checked AJAX but I'm not sure I can use AJAX in my
application.

Ajax is very suitable for this kind of interaction.

A Python programme 'file.py':

#!/usr/bin/env python
print "Content-type: text/html\n\n"
import random
print random.randrange(50)

(for the sake of simplicity, this just reurns a random number 0-50)

A javascript programme:

function ajax(url, vars, callbackFunction) {
if (window.XMLHttpRequest) {
var request = new XMLHttpRequest();
}
else {
var request = new ActiveXObject('MSXML2.XMLHTTP.3.0');
}
request.open('GET', url, true);
request.setRequestHeader('Content-Type', '');
request.onreadystatechange = function() {
if (request.readyState == 4 && request.status == 200) {
if (request.responseText) {
document.getElementById('myField').value =
(request.responseText).replace(/(\r\n|\r|\n|\s)/g, '');
}
}
}
request.send(vars);
// perform new call every 2 seconds (2000 milliseconds)
setTimeout("ajax('file.py?' + Math.random(), '', '')", 2000);
}
document.write('Status value: <input type="text" id="myField">');
ajax('file.py?' + Math.random(), '', '');

I've put a demo on the following URL:

http://www.dotinternet.be/temp/test.htm

Hope this helps,

--
Bart

.