2013-07-09 119 views
1

所以我搜索了很多的答案,似乎無法找到任何具體的這個...所以這裏去..如何獲取Kendo UI Grid中複選框的值?

我有一個標準的劍道UI網格 - 我已經設置了一列作爲如下:

{ title: "Sharing Enabled?", 
    field: "permissions_users_apps_user_sharing", 
    attributes: { 
     style: "text-align: center; font-size: 14px;" 
    }, 
    filterable: true, 
    headerAttributes: { 
     style: "font-weight: bold; font-size: 14px; width: 40px;" 
    }, 
    template: function(dataItem) { 
     if (dataItem.permissions_users_apps_user_sharing == 0) { 
      return "<input type='checkbox' name='permissions_users_apps_status' id='permissions_users_apps_status' value='1' />" 
     } else if (dataItem.permissions_users_apps_user_sharing == 1) { 
      return "<input type='checkbox' name='permissions_users_apps_status' id='permissions_users_apps_status' value='1' checked />" 
     } 
    } 
}, 

我想要做的就是這個複選框的值(看它是否已經改變),當我點擊我已經定義了一個命令按鈕。行是可選的..所以我可以得到行的ID。但我似乎無法收集複選框的價值。

任何人都有建議嗎?

在此先感謝..

回答

2

你可以得到複選框的情況下在數據綁定事件當複選框狀態變化。 看看下面的代碼可以幫助你。

.... 
columns: [ 
{ 
    { field: "select", template: '<input id="${BindedColumn}" onclick="GrabValue(this)" type="checkbox"/>', width: "35px", title: "Select" }, 
} 
.... 
selectable: "multiple, row", 
dataBound: function() { 
      var grid = this; 
      //handle checkbox change 
      grid.table.find("tr").find("td:nth-child(1) input") 
      .change(function (e) { 
       var checkbox = $(this); 
       //Write code to get checkbox properties for all checkboxes in grid 
       var selected = grid.table.find("tr").find("td:nth-child(1) input:checked").closest("tr"); 

       //Write code to get selected checkbox properties 
       ...... 
       //Code below to clear grid selection 
       grid.clearSelection(); 
       //Code below to select a grid row based on checkbox selection 
       if (selected.length) { 
        grid.select(selected); 
       } 
      }) 
     } 
     ..... 
     function GrabValue(e) 
     { 
     //Alert the checkbox value 
     alert(e.value); 
     //get the grid instance 
     var grid = $(e).closest(".k-grid").data("kendoGrid"); 
     //get the selected row data 
     var dataItem = grid.dataSource.view()[grid.select().closest("tr").index()]; 
     } 
0

使用此方法,您將獲得選中的複選框值。

  $("#MultiPayment").click(function() { 
       var idsToSend = []; 
       var grid = $("#Invoice-grid").data("kendoGrid") 
       var ds = grid.dataSource.view(); 
       for (var i = 0; i < ds.length; i++) { 
        var row = grid.table.find("tr[data-uid='" + ds[i].uid + "']"); 
        var checkbox = $(row).find(".checkboxGroups"); 
        if (checkbox.is(":checked")) { 
         idsToSend.push(ds[i].Id); 
        } 
       } 
       alert(idsToSend); 
       $.post("/whatever", { ids: idsToSend }); 
      }); 

爲更詳細​​