Posted 23 October 2017, 12:47 am EST
Hi
We have the issue, that after calling the method FlexGrid.autoSizeColumns() the controls in the angular form are removed. Because of that the validation does not work anymore.
Example (not working, as it is only part from our code): ```
<wj-flex-grid-column header="is critical" [width]="100" > <ng-template wjFlexGridCellTemplate cellType="Cell" let-cell="cell"> <input type="checkbox" [name]="'isCriticalControlPoint' + cell.item.order" [(ngModel)]="cell.item.isCriticalControlPoint" (ngModelChange)="propagateChange()" [disabled]="!canEdit"> </ng-template> </wj-flex-grid-column> </wj-flex-grid>
@Component({
selector: ‘recipe-steps’,
templateUrl: ‘recipe-steps.component.html’,
providers: [
{
provide: NG_VALIDATORS,
// tslint:disable-next-line:no-forward-ref
useExisting: forwardRef(() => RecipeStepsComponent),
multi: true
}
]
})
export class RecipeStepsComponent implements Validator {
public ingredientCollection: CollectionView;
@Input() public set isOfficial(value: boolean) { this.grid.refreshCells(false); } @ViewChild(NgForm) public form: NgForm; public validate(c: AbstractControl): { [key: string]: {} } { const errors = {}; Object.keys(this.form.controls).forEach(controlName => { const control = this.form.controls[controlName]; if (control.errors != undefined) { Object.keys(control.errors).forEach(error => { errors[error] = control.errors[error]; }); } }); return errors; }
}
So initially everything is fine. In the for each loop the inputs are listed in the controls array. But after the isOfficial input changes and the grid is resized, then the controls array is empty!
In my point of view this is a bug, the FlexGrid does not follow the angular guide lines here.
Thanks for looking into that.
As a workaround we have also looked for other options to change the height of the rows, but it looks like only the autoSizeRows method does shrink the height. All other methods like refreshAll only increase the heights. Is that correct.
