2017-10-09 10 views
0

を検出:jQueryのスクロール可能なオートコンプリート - 私は、次のjQueryを持って下

$("#input-name").autocomplete({ 
         source: function(request, response) { 
          if (!names.length){ 
           names = [NoResultsLabel]; 
          } 
          response(names); 
         }, 
         select: function (event, ui) { 
          if (ui.item.label === NoResultsLabel) { 
           event.preventDefault(); 
          } 
          for(var i=0;i<data.schools.length;i++){ 
           if(ui.item.label == names[i]){ 
            document.getElementById('filter[id]').value = ids[i]; 
            i = data.schools.length; 
           } 
          } 
         }, 
         focus: function (event, ui) { 
          if (ui.item.label === NoResultsLabel) { 
           event.preventDefault(); 
          } 
         } 
        }); 

私はそれをスクロール可能にするために、このCSSを追加しました:

<style> 
    .ui-autocomplete { 
     max-height: 100px; 
     overflow-y: auto; 
     overflow-x: hidden; 
    } 
    .ui-state-focus { 
     font-weight: normal; 
    } 
</style> 

と私は、ユーザーが下にスクロールしたときを検出したいです同じ名前に一致する行が多すぎるため、Ajaxリクエストを開始します(名前を指定して学校を検索し、対応するIDを返します)

私はこれを試しました

jQuery(function($) { 
      $('.ui-autocomplete').on('scroll', function() { 
       if($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) { 
        requests++; 
        getSchools(); 
       } 
      }) 
     }); 

が、それは私が、間違っていたものを見つけ、それはセレクタた

答えて

0

を働いていない、私はこれが

$("selector").autocomplete("widget").scroll(function(){ 
        ... 
       }); 

をworkaraound見つかりましたが、オートコンプリートが初期化された後にのみ、この関数を呼び出す

関連する問題