フォーム内のTextboxにAjaxを利用して値を埋め込む

2006年12月12日 オフ 投稿者: KYO
Table of Contents

[ prototype.js ]を利用した、簡単なAjaxサンプル。
テキストボックスに固定値(または任意の値)をAjaxを利用して埋め込む方法。
っていうか、こんなのメモする必要無いけど･･･。
とりあえず、メモです。


HTMLソース :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=shift_jis">
<title>AjaxでTextboxに値を埋め込む</title>
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/addtextbox.js"></script>
</head>
<body>
<form>
<input type="text" name="text" value="" id="text"><br>
<a href="javascript:getValue();"><=補完</a>
</form>
</body>
</html>

addtextbox.js :

// {{{ getValue()
function getValue()
{
new Ajax.Request(
{
method: "get",
onComplete: setValue()
}
);
}
// }}}
// {{{ setValue()
function setValue()
{
$('text').value = 'Ajax Auto Input';
}
// }}}
カテゴリーAjax HTML prototype
タグajax