ホーム » jQuery » jQuery - ユーティリティ - その他


オートコンプリート

はじめに、jQuery Autocomplete Mod を利用した非常に単純な、オートコンプリートの例を示します。

jQuery Autocomplete Mod のドキュメントへのリンクと日本語訳は、私のブログエントリ 「jQuery AutoComplete Mod」 に記載していますので、 そちらをご覧下さい。(もとの資料は indicator.gif を配置する手順が抜けています)

次のテキストボックスでは、アメリカの州に関するオートコンプリートを実装しています。試しに A や B など、アルファベットを入力してみてください。

アメリカの州:

このオートコンプリートを実現するためのクライアントコードは、以下です。

$(document).ready( function() {

     $('#us_state').autocomplete(
          'http://keicode.com/script/ac_test2.php'
     );
     
});

サーバー側のコードは示しませんが、q というパラメータを受け取り、アメリカの州の名前を一行ずつ返しています。

具体的には ?q=C というパラメータを受け取り、例えば次のような応答となります。

CALIFORNIA|CA
COLORADO|CO
CONNECTICUT|CT

ちなみに、ここで | 記号の後に続く CA や CO は州を表す省略記号です。(カリフォルニアの場合 "CA")

今回の実行サンプルでは、この省略記号は利用していません。


ホーム » jQuery » jQuery - ユーティリティ - その他