使用 JavaScript 和 jQuery 取消选中 ASP.NET MVC 中 Kendo Grid 选择列中的特定行：分步指南

Question

我的 ASP.NET MVC 5 项目中有一个 Kendo Grid。其中一列是选择列，如果它满足特定条件，我将尝试取消选择复选框。我已设法取消选择该复选框。问题是它只是更改 UI，但没有删除从 this.select() 中取消选择的内容。只需取消选中使条件 = true 的特定行并保留选中那些为 false 的行即可。

总之，如果条件= true，我想取消选中该框，将其从 this.select() 中删除，从 this.selectedKeyNames() 中删除，并从 this._selectIds() 中删除它。不要从 UI 中的表中删除该行。

下面的代码不是我正在使用的实际代码，而是与之类似的代码。下面的代码可能无法运行。

function onChange(e) {
   var selectedRows = this.select();
   for(var i = 0; i < selectedRows.length; i++){
       selectedRows[i].find("input[type='checkbox']").prop('checked', false);
       if( 2 > 6) {
          alert("You can't select this");
    }
  }
}

Answer 1

似乎是 change 事件无法在事件处理程序中阻止，因此您可以添加 dataBound 事件处理程序并将单击处理程序附加到选择的复选框。如果满足条件 - 停止事件的传播：

dataBound: function(){
          var grid = this;
          grid.tbody.find('tr .k-select-checkbox').on('click', function(e){
            var dataItem = grid.dataItem($(this).closest("tr"));
            if(dataItem.Discontinued){
              $(this).prop('checked', !$(this).prop('checked'));
              e.stopImmediatePropagation();
              kendo.alert(`${dataItem.ProductName} is discontinued, you cannot select it!`)
            }
          })
        }

在此示例中，您无法选择停产商品。