2016-09-15 6 views
0

をクリックしてくださいでは動作しません[UPDATE]剣道UI - カスタムグリッドフィルタ:チェックボックスは、各

私はのように行った後:私は、例えば、商品名フィルタのためにクリックし、[すべての項目を選択し、選択を解除するとき http://dojo.telerik.com/aqIXa 、他のフィールドの例単価に行き、選択しクリックして、私は製品名フィールドに折り返し、およびフィルタに今あるすべての選択を解除:

enter image description here

あなたがすべて選択コンボボックスをもう一度作成され、それが継続することを確認することができます私はステップを繰り返した後に作成します。誰もがアイデアを持っていますかなぜそれが起こっているのですか?

私は現在剣道で作業しており、各列にカスタムグリッドフィルタを作成しようとしています。すべての選択のためのチェックボックスを作成し、私は追加initCheckboxFilter機能、内部で

http://dojo.telerik.com/iwAWU

: 私はこの例を使用していました。

var selectAllCheckbox= $("<div><input type='checkbox' id='checkAll' checked/> Select All</div>").insertBefore(".k-filter-help-text"); 

及びIはimplemetedその機能外側:私はまた、単価とUnitInStockフィールドを追加

function clickMe(){ 
    $("#checkAll").click(function() { 
    if ($("#checkAll").is(':checked')) { 
     $(".book").prop("checked", true); 
    } else { 
     $(".book").prop("checked", false); 
    } 
}); 
} 

var element = $("<div class='checkbox-container'></div>").insertAfter(helpTextElement).kendoListView({ 
      dataSource: checkboxesDataSource, 
      template: "<div><input type='checkbox' class='colDefFilter' value='#:" + field + "#' checked />#:" + field + "#</div>", 
     }); 

の.bookは、内部テンプレートのクラスです)。

function onFilterMenuInit(e) { 
     debugger; 
     if (e.field == "ProductName" || "UnitPrice" || "UnitInStock") { 
      initCheckboxFilter.call(this, e); 

     } 
     } 

これは次のようになります。

enter image description here

初めて私は、いくつかの列フィルタ上のすべてのチェックボックスを選択しクリックしてチェックし、すべての項目のチェックを外し、それが正常に動作します。私は他の列でそれをしようとすると、イベントはトリガーではありません。誰が何が間違っているのか考えているのですか? ありがとう!

答えて

2

あなたの問題は、あなたがチェックのためだすべてのチェックボックスをIDを使用していることである、なぜ最初のドロップダウンあなたが(あなたのclickMeを変更するクラスではないIDとしてcheckAllを使用する必要があります(製品)

からのjQuery常に選択チェックボックスこれとそれが動作するように)機能:

:ここ

function clickMe(){ 
     $(".checkAll").click(function() { 
     if ($(this).is(':checked')) { 
      $(this).closest('.k-filter-menu').find(".book").prop("checked", true); 
     } else { 
      $(this).closest('.k-filter-menu').find(".book").prop("checked", false); 
     } 
    }); 
    } 

は一例にhttp://dojo.telerik.com/aqIXa

編集]を働いていますこの

var selectAllCheckbox= $("<div><input type='checkbox' class='checkAll' checked/> Select All</div>").insertBefore(e.container.find(".k-filter-help-text")); 

が、それ以外の場合は、複数の追加以前に初期化され、フィルタドロップダウンのためのすべてのチェックボックスを選択します。この

var selectAllCheckbox= $("<div><input type='checkbox' id='checkAll' checked/> Select All</div>").insertBefore(".k-filter-help-text"); 

のinstedよう

は、すべてのチェックボックスを選択して追加するために使用している方法がなければなりません。

更新されたデモ:http://dojo.telerik.com/aqIXa/4

+0

偉大なトリック!それを知らなかった、ありがとう、それは今働いています:) –

+0

クール、それはあなたのために働く場合は、私の答えを受け入れることができます:) –

+0

私はそれをやった! :D –

関連する問題