複選框事件不與jquery觸發

Question

我已經有了父網格中的複選框行和子網格中的複選框行以及Hierarchy grid mode using kendo UI。這樣的架構是這樣的...

我有四個行的父網格，在這一列是複選框和每個父行我有一個子網格，其中有4行和一個複選框列以及。 ..

如果我點擊父網格行中的複選框，我需要訪問與此行相關的子網格列中的複選框，並且需要將checked屬性設置爲對於該子網格爲true .....

因爲我正在訪問像這樣的父網格複選框..

這是javascript函數

<script type="text/javascript"> 
    $('.chkbxq').live('click', function (e) { 
     alert('1'); // this alert is not firing 
     var checkchildgrid = $('#Gridparent').find(".k-detail-row").find('td.k-detail-cell').find('[type="checkbox‌​"]').is(':checked'); 
     alert(checkchildgrid); 
     if ($(this).is(':checked')) {  
      checkchildgrid.attr('checked', 'checked'); 
     } else { 
      checkchildgrid.attr('checked', false); 
     }  
    });   
</script> 

，這是層次網格代碼....

@model IEnumerable<Topco.TopMapp.MVC.Models.CostPageSearch> 
@{ 
    ViewBag.Title = "Index"; 
} 

<h2>Index</h2> 
@using (Html.BeginForm()) 
{ 
    @(Html.Kendo().Grid<Topco.TopMapp.MVC.Models.CostPageSearch>() 
     .Name("Gridparent") 
     .Columns(columns => 
     { 
      columns.Template(@<text></text>).ClientTemplate("<input id='chqprnt' class= 'chkbxq' type='checkbox'/>").Width(30); 
      columns.Bound(e => e.CostPage).Width(100); 
      columns.Bound(e => e.Description).Width(100); 
      columns.Bound(e => e.VendorName).Width(100); 
      columns.Bound(e => e.BillTypeDirect).Width(100); 
      columns.Bound(e => e.BillTypeWarehouse).Width(100); 
      columns.Bound(e => e.VendorName).Width(100); 

     }) 
     .Sortable() 
     .Pageable() 
     .Scrollable() 
     .ClientDetailTemplateId("client-template") 
     .HtmlAttributes(new { style = "height:480px;" }) 
     .DataSource(dataSource => dataSource 
      .Ajax() 
      .PageSize(6) 
      .Read(read => read.Action("HierarchyBinding_Employees", "CostPageDisplay")) 
     ) 
     .Events(events => events.DataBound("dataBound")) 
) 
    <script id="client-template" type="text/kendo-tmpl"> 
     @(Html.Kendo().Grid<Topco.TopMapp.MVC.Models.ItemsDescriptionModel>() 
      .Name("grid_#=CostPage#") 
      .Columns(columns => 
      { 
       columns.Template(@<text></text>).ClientTemplate("<input id='checkbox' class='chkbx' type='checkbox' />").Width(30); 
       columns.Bound(o => o.ItemId).Width(100); 
       columns.Bound(o => o.ItemDescription).Width(100); 
       columns.Bound(o => o.BrandCode).Width(100); 
       columns.Bound(o => o.PackSize).Width(100); 
      }) 
      .DataSource(dataSource => dataSource 
       .Ajax() 
       .PageSize(5) 
       .Read(read => read.Action("HierarchyBinding_Orders", "CostPageDisplay" , new { employeeID = "#=CostPage#" })) 
      ) 
      .Pageable() 
      .Sortable() 
      .ToClientTemplate() 
    ) 
    </script> 
<script> 
    function dataBound() { 
     this.expandRow(this.tbody.find("tr.k-master-row").first()); 
     //alert('1'); 
    } 
</script> 

，但是當我點擊父網格的單擊事件在不觸發該複選框...

將任何一個請提出任何想法和解決方案，這個問題將非常感謝我.....

非常感謝提前...

編輯：你會請看看下面的圖片是我放在複選框並單擊該複選框不點火事件......

Answer 1

試試這個，

$('#Gridparent').on("click", ".chkbxq", function (e) { 

     var selected = $(this).is(':checked'); 

     var grid = $("#grid12").data("kendoGrid"); 


     if (selected == true) { 

      var check = $('.k-detail-row').find('td.k-detail-cell').find('div.k-grid').find('table').find('tbody').find('[type="checkbox"]').attr('checked', true); 
      var asd = check.is(':checked'); 
      alert(asd); 
     } 

     }); 

使用電網點擊。

Answer 2

看看下面是否有幫助：

<script type="text/javascript"> 

    $('.chkbxq').on('click', function (e) { 

    alert('1'); // this alert is not firing 

    var checkchildgrid = $('#Gridparent').find(".k-detail-row").find('td.k-detail-cell').find('[type="checkbox‌​"]').prop('checked'); 
    alert(checkchildgrid); 

    if ($(this).prop('checked')) {  
     checkchildgrid.prop('checked', 'checked'); 
    } else { 
     checkchildgrid.prop('checked', false); 
    }  
});   

我希望它能幫助。

Answer 3

這是我想象它應該編碼 - 免責聲明我完全不

知道劍道如果我們需要處理的複選框，當你寫，我們可以做

$(function() { 
    $('.chkbxq').on('click', function (e) { 
    var checked = this.checked; 
    $('#Gridparent').find(".k-detail-row").find('td.k-detail-cell').find('[type="checkbox‌​"]').each(function() 
     this.checked=checked; // toggle 
    });  
    });  
});   

如果內容是ajaxed，您需要

$(function() { 
    $("#Gridparent").on('click','.chkbxq', function (e) { 
    var checked = this.checked; 
    $(this).find(".k-detail-row").find('td.k-detail-cell').find('[type="checkbox‌​"]').each(function() 
     this.checked=checked; // toggle 
    });  
    });  
});   

注意 .find工作一路下跌的DOM，所以也許你只是想

$(this).find('[type="checkbox‌​"]').each(function()