jqueryモバイルリストビューフィルタ後のアイテム数

Question

助けが必要です。ボタンをクリックするか、テキストフィルタを適用して、フィルタが適用された後に可視リストビュー項目の数を表示しようとしています。ボタンをクリックするだけで、テキストがテキストフィルタに入力されるので、すべて同じトリガーポイントになります。フィルタが適用される前のjavascript火災

HTMLはかなりこのような...

<div> 
     <form class="ui-filterable"> 
      <input id="myFilter" data-type="search" placeholder="Text Filter..."> 
     </form> 

     <div data-role="fieldcontain"> 
      <input type="button" data-inline="true" value="More Info Provided" id="more-info-provided-filter" /> 
      <input type="button" data-inline="true" value="In Progress" id="in-progress-filter" /> 
     </div> 

     <p id="listInfo"></p> 

     <ol data-role="listview" id="myList" data-filter="true" data-input="#myFilter"></ol>   
    </div> 

され、各ボタンのクリックのための私のjavascriptのは、ちょうどこのようなものです...

$(document).on('click', '#in-progress-filter', function(){  
    $('input[data-type="search"]').val('in progress'); 
    $('input[data-type="search"]').trigger("keyup"); 

    var volListItemsDisplayed; 
    volListItemsDisplayed = $("#myList li:visible").length;  
    document.getElementById("listInfo").innerHTML = "Number of items (filter on): " + volListItemsDisplayed; 
}); 

。イベントのonchangeタイプのように、フィルタに関数を追加する方法はありますか？リストビューには、ボタンによって適用されたテキスト文字列のいずれかを含むレコードが挿入されていると仮定できます。 JQMで

おかげ

Answer 1

をあなたが方法以下のことを行うことができます。

$(document).on("pagecreate", "#search-page-id", function(e) { 
    $("#my-list").on("filterablefilter", function(e, data) { 
     var result = $(this).children("li").not(".ui-screen-hidden").length; 
     console.log("FILTERED ITEMS: ",result); 
    }); 
}); 

あなたのリストビュー内のあなたにも仕切りをリストアップしている場合は、それらを除外することによって、フィルタを絞り込むことがあります。

var result = $(this).children("li").not("[data-role=list-divider]").not(".ui-screen-hidden").length; 

を