[ JQuery ] [ 入力補完01 ] [ 入力補完02 ] [ 入力補完03 ] [ 入力補完04 ]
- 2013-12-23 編集
入力補完02
テスト
説明
$( "#ac1" ).autocomplete({
source:monthfile
});
sourceに、文字列変数を指定すると、それをURL、パスとして解釈し、「?term=入力された文字列」を付加して実行した結果をリストとして利用します。
実行結果は、json形式で返します。
参考 JSON: http://ja.wikipedia.org/wiki/JavaScript_Object_Notation
12345,23456,22222,3333の4つが候補になるとしたら、次のような内容を返すようにします。返すと言っても print で標準出力に出力するという事になります。
[ "12345", "23456", "22222", "3333" ]
ソース
上記テストのソースは
#html{{
<link rel="stylesheet" href="./jquery/css/redmond/jquery-ui-1.10.3.custom.css">
<script src="./jquery/js/jquery-1.9.1.js"></script>
<script src="./jquery/js/jquery-ui-1.10.3.custom.js"></script>
<style>
ul.ui-autocomplete li a {
text-align:left;
color:red;
}
</style>
<script>
$(function(){
var monthfile ="./sample_data/testcsv001.php";
$( "#ac1" ).autocomplete({
source:monthfile
});
});
</script>
<input type="text" id="ac1" size="20">
}}testcsv001.php の内容は、次の様になっています。term=で渡される文字とは全く関係なく固定の内容になっています。
<?php
print <<<eodata
["001,abcdef,123456",
"002,aaaaaa,222222",
"003,ababab,333333",
"004,bbbccc,444444",
"005,ccddee,555555"]
eodata;
?>PHPのスクリプト側で検索する前に、もうひとつsourceがjavascriptの関数だった場合についてテストします。