<< wgetでcron設定(さくらサーバー) | main | ベイズ推定に関する心理学的アプローチ >>

suggest.js + jquery で AJAX

suggest.jsがすばらしいのでjquery で ajax化 しましたよ!

JSON形式でデータを戻せばevalで読み取りますよ。


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>suggest.js + jquery = ajax</title>
<style type="text/css">
<!--
#suggest {
  position: absolute;
  background-color: #FFFFFF;
  border: 1px solid #CCCCFF;
  width: 265px;
  font-size:12px;
  cursor:pointer;
}
#suggest div {
  padding: 5px;
  display: block;
  width: auto;
  overflow: hidden;
  white-space: nowrap;
}
#suggest div.select{
  color: #FFFFFF;
  background-color: #3366FF;
}
#suggest div.over{
  background-color: #99CCFF;
}
-->
</style>
<script type="text/javascript" src="/YOUR/suggest.js"></script>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
<!--
$(function(){
   new Suggest.Local(
      "freeword",
      "suggest",
      [],
      {
        highlight: true,
        hookBeforeSearch: function(text) {
         var self = this;
         $.post("http://YOU.WANNA.POST/AJAX.php",
            {inp:text},
            function(data, status){
               if(status == 'success' && data){
                  self.clearSuggestArea();
                  self.candidateList = eval(data);
                  var resultList = self._search(text);
                  if (resultList.length != 0){
                     self.createSuggestArea(resultList);
                  }  
                  exit;
               }
            }
         );
        }
      }
   );
});
-->
</script>
</head>
<body>
<form method="post">
<input id="freeword" name="freeword" type="text"
autocomplete="off" size="40" style="display: block"/>
<div id="suggest"></div>
</form>        
</body>
</html>

コメント
こんにちは。
こちらのコードを利用して使ってみているのですが、JSON形式はどのような形で返せばいいのでしょうか?

{"key":"aaaaa","key":"bbbbb"}

をphpでechoしてみているのですが、何も反応がありません。
アドバイスいただけませんか?
  • aas
  • 2010/08/23 5:47 PM
間違えました!
普通に配列でした!

["aaaaa","bbbbb"]

でやってみてください!
お手数おかけしました!
  • uchida
  • 2010/08/24 11:58 AM
管理者の承認待ちコメントです。
  • -
  • 2010/08/26 4:35 AM
コメントする









この記事のトラックバックURL
トラックバック
calendar
   1234
567891011
12131415161718
19202122232425
262728293031 
<< March 2017 >>
selected entries
categories
archives
recent comment
recommend
links
profile
search this site.
others
mobile
qrcode
powered
無料ブログ作成サービス JUGEM