Question

如何禁用kendo-grid-checkbox-column？

我尝试过

[disabled]="true"
[attr.disabled]="true"
disabled ="true"
disabled
readonly

但是在列

下禁用此功能没有任何帮助。

<kendo-grid-checkbox-column   width="50" showSelectAll="true">
        </kendo-grid-checkbox-column>

Answer 1

您可以使用Grid rowClass输入并提供一个函数，该函数将为所有通过某些数据项的数据项返回“ k-disabled”类（或任何其他阻止用户与给定行进行交互的自定义类）。条件，例如：

public isDisabled(args) {
  return {
       'k-disabled': args.dataItem.UnitsOnOrder === 0
   }; 
}

我希望这会有所帮助。

======== OR =======

<kendo-grid-checkbox-column>
<ng-template kendoGridCellTemplate let-dataItem let- 
rowIndex="rowIndex" >
<div class="{{dataItem.UnitsOnOrder === 0 ? 'k-disabled' : ''}}">
  <input [kendoGridSelectionCheckbox]="rowIndex" />
</div>
</ng-template>

Answer 2

您可以通过指定自定义模板并将条件添加到[disabled]属性中来生成禁用的复选框。

 <kendo-grid-checkbox-column width="80"  [locked]="true">
        <ng-template kendoGridCellTemplate let-dataItem let-rowIndex="rowIndex" >

        <input  *ngIf="!dataItem.IsNew"
                [disabled]="dataItem.IsNew === true"
                type="checkbox"
                class="k-checkbox"
                id="checkbox-{{rowIndex}}"
                [kendoGridSelectionCheckbox]="rowIndex"
                />  
        <label class="k-checkbox-label"
            for="checkbox-{{rowIndex}}">
        </label>
      </ng-template>
    </kendo-grid-checkbox-column>

这将呈现出一个Kendo复选框，该复选框将根据上面指定的条件被禁用。

如果要在标题中显示“全选”复选框，则需要将此模板添加到复选框列：

       <ng-template kendoGridHeaderTemplate >
            <input kendoGridSelectAllCheckbox type="checkbox"
                class="k-checkbox"
                id="headerCheckbox"
            />
            <label class="k-checkbox-label"
                        for="headerCheckbox"
                ></label>
       </ng-template>

如何禁用kendo-grid-checkbox-column？

2 个答案: