2017-11-22 12 views
0

剣道グリッドのグループヘッダーにチェックボックスを追加しようとしています。このチェックボックスは、それが関数にバインドされた値、および機能にバインドされたクリックイベントをチェックしています持っている必要があります。しかし、ボックスをクリックすると、クリックイベントを発生させようとしません。現在、私が持っているコードは、グリッドがグループ化されているここは、に電子メールを送信する企業のリストを構築するために使用されている。この剣道グリッドグループヘッダーのクリックイベント

グリッドグループヘッダーテンプレート

<script type="text/x-kendo-template" id="group-header-email-checkbox-template"> 
    <input type="checkbox" class="chkdbox emailCheckBox" data-bind="checked: emailSelected("#:value#"), events: {click: onEmailCheck}" />&nbsp;&nbsp;#:value# 
</script> 

JS

checkEmail:function(e) { 
     var me = this; 
     console.log(e); 
    }, 
    emailSelected:function(val) { 
     var me = this; 
     var email = _.find(me.selectedEmails, 
      function(e) { return e.name === val } 
     ); 
     return email; 
    } 

です会社情報に

答えて

0

私はクリックイベントを追加することになりましたjqueryを通して。

$(".emailCheckBox").on("change", function(e) { 
    me.checkEmail(e); 
}); 

このテンプレートを使用します。

<script type="text/x-kendo-template" id="group-header-email-checkbox-template"> 
    <input type="checkbox" class="chkdbox emailCheckBox" data-company="#:value#" />&nbsp;&nbsp;#:value# 
</script> 

これはまだページングするとき、彼らはどのような方法で保持されませんでした私に問題を与えたが、私は永続性の問題をこのように解決 -

setHeaderChecks:function() { 
    var me = this; 
    $(".agingEmailCheckBox").each(function() { 
       var value = $(this).data("company"); 
       var checked = _.find(me.selectedCompanies, function(e) { return e.company === value }); 
       if (checked) { 
        $(this).prop("checked", true); 
       } 
     }); 
    }, 
0

デフォルトでは、グリッドのヘッダーとフッターはViewModelにバインドされていません。この問題を回避するには、グリッドが手動で結合し、次に初期化とされた後、適切なjQueryのセレクタとヘッダを見つけることです。したがって、このような何か:

kendo.bind($("body"), viewModel); //Instantiate the grid 
kendo.bind($("#grid").find(".k-grid thead"), viewModel); //Find and bind the header 

詳細はこちらを参照してください:私は、グリッドのフッターを結合について書いた非常によく似た答えをhttps://www.telerik.com/forums/tooltip-mvvm-control-inside-grid-column-headertemplate-is-not-working

そして、ここで:kendo grid column: how to data bind click event in footer template?

関連する問題