jQuery,Ajaxでcgiに接続する方法がわからなくて困っています

解決済

質問者：keeeeeeeen
質問日時：2010/04/28 16:25
回答数：2件

jQuery,Ajaxでcgiに接続する方法がわからなくて困っています。
あるデータベースのあるテーブル（仮にpersonテーブル）を参照して、html上のformタグに文字を入れるとselectボックス内に表示されるものがマッチしたものが表示されるようなものを作りたいと思っています。

例えば、
personテーブルのperson_nameカラムには（秋本、本田、寺西、寺本、戸田、吉岡）という情報が入っていて、selectボックス内は最初全ての人名が出ているとします。
person.htmlというテンプレートのformのところに【寺】と入力するとselectボックス内は寺西と寺本だけ表示される。

そのようなものを作りたいと思っていますがうまくいきません。何か参考になるＵＲＬだけでもかまいませんのでご教授下さい。
できればサンプルソースがあればうれしです。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： yyr446
回答日時：2010/04/30 18:21

とりあえずjQueryのサンプルです。

（cgiがperlでなくPHPで申し訳ない）
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja-JP">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<script type="text/javascript" charset="utf-8" src="/jslib/jquery-1.4.2.min.js"></script>
<script type="text/javascript" charset="utf-8">

</script>
<body>
<body>
<form>
<input id="search_name" type="text" value="">
</form>
<select name="person" id="person">
<option value="秋本">秋本<option value="本田">本田<option value="寺西">寺西
<option value="寺本">寺本<option value="戸田">戸田<option value="吉岡">吉岡
</select>
</body>
</html>

cgi(PHP)側のサンプル
<?php
header("Content-type:text/javascript");
mb_language("japanese");
mb_internal_encoding("UTF-8");
mb_http_output("UTF-8");
if(isset($_POST['search_name'])){
/*
ここにDB検索処理を記述
「$_POST['search_name']をキーにして読み込んだデータを
配列変数$dataに格納する。」
*/
$data= array("寺西","寺本"); //テスト用サンプル
echo json_encode($data);
}
?>

- 0
- 件

通報する

この回答へのお礼

ありがとうございます。
参考にしてみます。

通報する

お礼日時：2010/04/30 22:09

No.1

回答者： yyr446
回答日時：2010/04/30 16:12

まずは、やり方を...

「formのところに【寺】と入力すると」
の部分は、onkeyupのイベントでajaxを起動することにします。
ajaxでjson形式のテキストを返してもらって、それでselectボックスの
<option>たちを作り直せばよいです。
cgi側のDBを読む処理は、そちらのカテゴリーで聞いてみてください。
そもそもDBって何ですか？cgiはPerlですか？
PHP＋MySQLなら、サンプル提示出来そうですが．．．