Sunday, March 18, 2007

ajax prototype.js を使った「処理中」のメッセージ表示

<script type="text/javascript" src="./prototype.js"></script>
<script type="text/javascript">
//<![CDATA[
function progressMessage(){
$("status").innerHTML = 'Please Wait..' ;
}

function upload(){
var filename = $F('filename');
var param = 'filename=' + filename ;
var url = "./upload.cgi";
new Ajax.Request(url, {method: 'post', parameters: param, onComplete: result, onLoading: progressMessage});
}
function result(req){
$("status").innerHTML = req.responseText ;

}
//]]>
</script>
</head>
<body>

<form >
<input type="button" value="実行" onclick="upload()"/>
</form>
<span id="status"></span>

-----
#!/usr/bin/perl

sleep 5; # 重い処理のつもり

print "Content-type: text/html;charset=Shift_JIS\n\n";

print "Thank you";

No comments: