Answer:
Follow the below steps to display Boolean type column as check box and disable editing, selection.
1. To display Boolean columns as checkbox, set DisplayAsCheckbox property of GridColumn as true. Refer the
UG documentation for your reference.
2. To set HeadetText, set corresponding values in HeaderText property of GridColumn.
3. To Disable editing, set AllowEditing as false for the column.
4. To disable selection, add .e-checkbox-disabled class in the checkbox row cells by using the QueryCellInfo event of the grid and then set pointer-events css property as none for the added class.
Here is the code snippet for your reference,
<SfGrid DataSource="@DataList">
<GridEditSettings AllowEditing="true">GridEditSettings>
<GridSelectionSettings Type="SelectionType.Single">GridSelectionSettings>
<GridEvents QueryCellInfo="QueryCellInfoHandler" TValue="LookupTable">GridEvents>
<GridColumns>
<GridColumn Field=@nameof(LookupTable.TextDisplay) AllowEditing="false" HeaderText="Team" Width="40">GridColumn>
<GridColumn Field=@nameof(LookupTable.isMale) HeaderText="is Male" Width="50" DisplayAsCheckBox="true" AllowEditing="false">
GridColumn>
GridColumns>
SfGrid>
<style>
.e-checkbox-disabled {
pointer-events: none;
}
style>
@code{
public void QueryCellInfoHandler(QueryCellInfoEventArgs args)
{
if (args.Column.Field == "isMale")
{
args.Cell.AddClass(new string[] { "e-checkbox-disabled" });
}
}
} |