0

ユーザーが部分的な名前を入力すると、データベースから一致する完全な名前が検索されるサイトで、jquery オートコンプリート検索機能が機能しています。問題は、一致する場合、次のマークアップを使用して名前の一致を表示できなかったことです。かなり見栄えの悪いデフォルトのオートコンプリートマークアップで動作しています。以下の例では、結果が li に表示される必要があります。

<div class="search_dropdown_wrapper">
    <div id="search_arrow" class="dropdown_pointer search"></div>
    <ul>
        <li>
            <a>Sam Cohen</a>
            <p>Software Engineer</p>
        </li>
    </ul>
</div>

上記の div を使用してオートコンプリートで ul をラップするのに問題があります。コードをいじってみましたが、マークアップで結果を部分的に表示するようになりましたが、リンク機能が台無しになり、名前をクリックしてもテキスト ボックスに入力されなくなりました。これが私が使用しているオートコンプリートコードです..

if($('#search_name').length > 0){
  $('#search_name').autocomplete({
    minLength: 2,
    source: '/profiles/jquery_auto_complete_name',
        focus: function(event, ui) {
            $('#search_name').val(ui.item.first_name + " " + ui.item.last_name);
            return false;
        },
    select: function(event, ui) {
        $("#receiver-list").val(ui.item.first_name + " " + ui.item.last_name);
        return false;
    }
  })
  .data( "autocomplete" )._renderItem = function( ul, item ) {
      return $( "<li></li>" )
      .data( "item.autocomplete", item )
      .append("<a>" + item.first_name + " " + item.last_name + "</a>")
      .appendTo( ul );
  };
}

(クレジット: How to setup jquery-ui autocomplete in Railsのオートコンプリートの素晴らしい例に感謝します)

ありがとうございました。

4

1 に答える 1

0

このための素晴らしい宝石を見つけることができます:

https://github.com/crowdint/rails3-jquery-autocomplete

よろしくお願いします!

于 2012-12-01T09:48:31.200 に答える