非同期通信を行う

書式

 windowObj.setAjaxContent(url, option, showCentered, showModal)

windowObj : ウィンドウオブジェクト
url : URL
option : 非同期通信オプション
showCentered : センタリング(true : する、false : しない)
showModal : モーダルモード(true : モーダルモード、false : 通常モード)

説明

 非同期通信を行うにはsetAjaxContent()を使います。最初のパラメータにはURL、2番目のパラメータには通信オプションを指定します。この通信オプションはscript.aculo.usライブラリのAjax.request()で指定されるものになります。3番目のパラメータはウィンドウを中央に表示するかどうかのフラグです。trueであれば縦横ともブラウザウィンドウの中央に表示されます。初期状態ではfalseになっています。4番目のパラメータはモーダルモードでtrueにすると、ウィンドウの外側の部分はクリックしたりすることができなくなります。通常はfalseで初期状態でもfalseとなっています。

サンプルコード [実行]

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>Sample</title>
<link rel="stylesheet" href="default.css" type="text/css" media="all">
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript" src="effects.js"></script>
<script type="text/javascript" src="window.js"></script>
<script type="text/javascript"><!--
var win;
window.onload = function(){
win = new Window("win01", {
title: "Sample", className: "dialog",
top:130, left:10, width:320, height:240,
zIndex: 100, resizable: true, draggable:true
});
win.setDestroyOnClose();
win.show();
}
function loadText(){
win.setAjaxContent("sample.txt", { onComplete:dispData }, false, false);
}
function dispData(httpObj){
$("result").innerHTML = "読み込み完了";
}
// --></script>
</head>
<body>
<h1>サーバーデータを読み込み表示する</h1>
<form>
<input type="button" value="読み込み" onClick="loadText()">
</form>
<div id="result"></div>
</body>
</html>