Posted 4 March 2021, 6:28 pm EST - Updated 3 October 2022, 2:19 pm EST
I have tried to implement https://www.grapecity.com/wijmo/demos/Grid/Selection/CheckboxSelection/angular but the checkbox column is not showing up.
<label>
Header Column
<input #headersCheckbox type="checkbox" [checked]="headers" (change)="setHeaders(headersCheckbox.checked)" />
</label>
<wj-flex-grid #flexGrid class="bento-flex-grid" [class.list-grid]="isListGrid" [itemsSource]="data"
[stickyHeaders]="true" [showMarquee]="true" [showSort]="true" (initialized)="initGrid(flexGrid)"
[allowSorting]="'MultiColumn'" [alternatingRowStep]="0" [deferResizing]="true">
<!-- FLEXGRID FILTER -->
<wj-flex-grid-filter #filter></wj-flex-grid-filter>
<!-- Actions Column -->
<wj-flex-grid-column [header]="'Actions'" [binding]="'actions'" [minWidth]="150" [width]="150" [isReadOnly]="true"
[allowSorting]="false" [allowDragging]="false" [cssClass]="'action-column'">
<ng-template wjFlexGridCellTemplate [cellType]="'Cell'" let-col="col" let-row="row" let-item="item">
<span class="bento-icon-edit grid-action-icon" (click)="actions.editRow(item)" ngbTooltip="Edit"
container="body" title="Edit"></span>
<span class="bento-icon-folder grid-action-icon" (click)="actions.editRow(item)" ngbTooltip="Attach"
[style.display]="!toggleStatus ? 'inline' : 'none'" container="body" title="Attach"></span>
<div ngbDropdown [container]="'body'" class="grid-dropdown">
<button aria-label="Select more action" class="btn btn-outline-primary btn-xs dropdown-toggle"
ngbDropdownToggle (click)="actions.showOptions(item)">
More
<i aria-hidden="true" class="bento-icon-caret-down-filled"></i>
</button>
<div ngbDropdownMenu aria-labelledby="dropdownBasic1">
<button ngbDropdownItem
[ngClass]="option.IsEnabled === true ? 'dropdown-item' : 'disable-dropdown-item'"
*ngFor="let option of moreOptions; let i = index;" (click)="onActionSelect(option,row.index)"
[hidden]="!option.Visibility">{{option.displayName}}</button>
</div>
</div>
</ng-template>
</wj-flex-grid-column>
<wj-flex-grid-column *ngFor="let col of gridColumns" [header]="col.header" [binding]="col.binding"
[visible]="col.visible" [width]="col.width" [isReadOnly]="true">
<ng-template *ngIf="col.binding=='severity_color'" wjFlexGridCellTemplate [cellType]="'Cell'" let-item="item">
<img src="assets/images/{{item.severity_color.toLowerCase()}}.PNG" alt="{{item.severity_color}}"
width="15px" height="15px" />
</ng-template>
<ng-template *ngIf="col.binding=='wsu_checklist'" wjFlexGridCellTemplate [cellType]="'Cell'" let-item="item">
<a href="#!" alt="{{item.wsu_checklist}}">{{item.wsu_checklist}}</a>
</ng-template>
<ng-template *ngIf="col.binding=='wsu_followup'" wjFlexGridCellTemplate [cellType]="'Cell'" let-item="item">
<div *ngIf="item.wsu_followup == 'true'"><span class="bento-icon-flag-filled grid-action-icon"></span>
</div>
</ng-template>
</wj-flex-grid-column>
</wj-flex-grid>
When the header column is unchecked the row height gets increasing
Please let me know if I’m missing anything.
