我怎样才能得到复选框选中项目从网格使用jquery

Question

我有两个kendo UI网格（父网格，子网格）和我有复选框的父网格列，如果我点击网格中的行中的复选框，我需要得到相应的行数据，我需要做的移动选定的行数据到另一个网格，当点击按钮，因为我已经实现了像这样的按钮clikc ...

为此，我做了这样的事情。 ...

@Scripts.Render("~/bundles/jquery") 
    <script type="text/javascript"> 
    $(document).ready(function() 
    { 
     $('#btnMove').click(function() { 

      ('#GridParent').on("click", "td", function (e) { 
       var selectedTd = $(e.target).closest("td"); 
       var grdChkBox = selectedTd.parents('tr').find("td:first").next("td").find('input:checkbox'); 
       //grdChkBox.prop('checked', !grdChkBox.prop('checked')); 
       if(grdChBox.Checked) 
       { 
        // here I need to get the checkbox selected item row data 
        // i dont know it is the correct way to get the item pls correct me                 
       } 

      var sourcegrid = $('#GridParent').data('kendoGrid'); 
      var destinationgrid = $('#ChildGrid').data('kendoGrid'); 

      var checkeditem =       
      });  
</script> 
@model IEnumerable<KendoSampleMVCApp.Models.StudentDetails> 
@{ 
    ViewBag.Title = "Index"; 
} 

<h2>Index</h2> 
@using (Html.BeginForm()) 
{ 
    @(Html.Kendo().Grid<KendoSampleMVCApp.Models.StudentDetails>()  
    .Name("GridParent") 
    .Columns(columns => { 
     columns.Bound(p => p.studentclass).HeaderTemplate("<input id='selectall' class='chkbx' type='checkbox' onclick='ToggleChkBox(this.checked);' />").ClientTemplate("<input id='checkbox' onclick='grdChkBoxClick(this); ' class='chkbxq' type='checkbox' />").Sortable(false).Filterable(false).Width(30); 
     columns.Bound(p => p.studentId).Filterable(false).Width(90); 
     columns.Bound(p => p.studentName).Filterable(false).Width(90); 
     columns.Bound(p => p.StudentBranch).Filterable(false).Width(90); 

    }) 
    .Pageable() 
    .Sortable() 
    .Scrollable() 
    .Filterable() 
    .Resizable(resize => resize.Columns(true)) 
    .Reorderable(reorder => reorder.Columns(true)) 
    .Selectable(s => s.Mode(GridSelectionMode.Multiple)) 
    .HtmlAttributes(new { style = "height:250px;" }) 
    .DataSource(dataSource => dataSource 
     .Ajax() 
     .PageSize(20) 
     .Read(read => read.Action("Orders_Read", "StudentDtls")) 
    ) 
) 

<input id="btnMove" type="button" value="Move" /> 
    // second grid ....... 

我不知道有关数据怎样才能当复选框选中

将在此任何一个请帮助... 非常感谢.....

Answer 1

在从控制器端新gridcheckbox检查选择行绑定。希望这是为你工作

查看

@{ 
    ViewBag.Title = "GridListView"; 
} 
<h2> 
    GridListView</h2> 
<script src="~/Script/Jquery-1.8.1.min.js" type="text/javascript"></script> 
<script src="~/Script/jquery-ui-1.8.20.min.js" type="text/javascript"></script> 
<script src="@Url.Content("~/Script/kendo.all.min.js")" type="text/javascript"></script> 
<script src="~/Script/kendo.web.min.js" type="text/javascript"></script> 
<script src="~/Script/kendo.aspnetmvc.min.js" type="text/javascript"></script> 
<link href="~/Content/kendo.common.min.css" rel="stylesheet" type="text/css" /> 
<link href="~/Content/kendo.default.min.css" rel="stylesheet" type="text/css" /> 
<script type="text/javascript"> 
    $(document).ready(function() { 

     $('#grid12').on("click", ".chkbxq", function (e) { 
      var selectedTd = $(this).is(':checked'); 

      var rowIndex = $(this).parent().index(); 
      var cellIndex = $(this).parent().parent().index(); 
      var grid = $("#grid12").data("kendoGrid"); 
      var datatItem = grid.dataItem(grid.tbody.find('tr:eq(' + cellIndex + ')')); 

      if (selectedTd == true) { 
       sampleItem = datatItem.SampleItems; 
       sampleCode = datatItem.SampleCode; 
       sampledescription = datatItem.SampleDescription; 

       datavalueitem = sampleItem + "--" + sampleCode + "--" + sampledescription; 

       $.ajax({ 
        url: '@Url.Action("NewGridView", "Test")', 
        type: "Post", 
        data: { sampleItem: sampleItem, sampleCode: sampleCode, sampledescription: sampledescription }, 
        dataType: 'json', 
        success: function (result) { 
         debugger; 
         $("#mygrid").val(null); 
         var customDataList = $('#grid'); 
         customDataList.empty(); 
         customDataList.append(result.Data); 
         customDataList.append(result.Data); 

          $("#divasd").kendoGrid({ 
         dataSource: result, 
         sortable: true, 
         pageable: { 
          refresh: true, 
          pageSizes: true 
         }, 
         columns: [ 
         { 
          field: "SampleDescription", 
          width: 90, 
         }, { 
          field: "SampleCode", 
          width: 90, 
         }, { 
          width: 100, 
          field: "SampleItems" 
         } 
        ] 
        }); 

        } 
       }); 
      } 


     }); 

    }); 
</script> 
@using (Html.BeginForm("GridListView", "Test", FormMethod.Post)) 
{ 

    <input id="Submit1" type="button" value="SubmitValue" /> 
    @(Html.Kendo().Grid<TwoModelInSinglePageModel.SampleModel>() 
    .Name("grid12") 
    .Columns(columns => 
    { 
     columns.Bound(p => p.studentclass).HeaderTemplate("<input id='selectall' class='chkbxq' type='checkbox' />").ClientTemplate("<input id='checkbox' class='chkbxq' type='checkbox' />"); 
     columns.Bound(p => p.SampleDescription); 
     columns.Bound(p => p.SampleCode); 
     columns.Bound(p => p.SampleItems); 
    }) 
     .AutoBind(true) // here I am disabling automatic binding at page load 
     .DataSource(dataSource => dataSource 
     .Ajax() 
      .Read(read => read.Action("Read", "Test")) 
    ) 
) 

    <br /> 

    <div id="divasd"> 
    </div> 
} 

控制器

public JsonResult NewGridView(string sampleItem, string sampleCode, string sampledescription) 
     { 

      List<SampleModel> sampleAddList = new List<SampleModel>(); 
      SampleModel sampleAdd = new SampleModel(); 
      sampleAdd.SampleCode = sampleCode; 
      sampleAdd.SampleDescription = sampledescription; 
      sampleAdd.SampleItems = sampleItem; 

      sampleAddList.Add(sampleAdd); 
      var result = sampleAddList; 


      return Json(result, JsonRequestBehavior.AllowGet); 

     } 

从Controller side

型号此绑定电网

public class SampleModel 
    { 
     public bool studentclass { get; set; } 
     public string SampleDescription { get; set; } 
     public string SampleCode { get; set; } 
     public string SampleItems { get; set; } 
    }