I am currently adding using the beginAddRowByIndex function, and one thing I noticed is that when I add a row with the following columns, a placeholder value (header text) is shown in the entityId and description columns, but not the dataType column.
<igx-column field="entityId" header="Property Id" [sortable]="true"></igx-column> <igx-column field="description" header="Description" [sortable]="true"></igx-column> <igx-column field="dataType" header="Data type" [sortable]="true"> <ng-template igxCell let-val let-cell="cell">{{val | lookup: dataTypesLookup}}</ng-template> </igx-column>
After digging through the cell.component.html file, I noticed that in the #addRowCell template, it's using a property called isEmptyAddRowCell to conditionally render the cell value, or the header. Given an ng-template with the igxCell directive, is there any way to determine the following:
While this solution may work, it's a bit of a hack in my opinion. I shouldn't have to modify any values to be able to tell if a row is a new row or not. I should be able to determine that through the igxCell directive. What would be ideal is being able to say something like: cell.row.isAddRow, and be able to render different information based on that.
Hello Michael,
After investigating this further, I determined that addRowCell template is not applied to the Data Type column because another template is added to this column.
Additionally, what I could suggest is checking if the value of the cell component is undefined and if there is a template applied to the cell and setting the cell value to the column field.
public beginAddRow() {
this.grid1.beginAddRowByIndex(2);
this.grid1.getRowByIndex(2).cells.forEach((cell) => {
if (cell.column.bodyTemplate && !cell.value) {
cell.value = cell.column.field;
}
});
Furthermore, in a method bound to the rowEditExit event the value of the cell would be set back to undefined if the value equals the filed name.
public rowEditExit(evt) {
if (evt.isAddRow && evt.newValue?.OrderDate === 'OrderDate') {
evt.newValue.OrderDate = undefined;
I have prepared a sample, demonstrating the described behavior. Please test it on your side and let me know if you need any further information regarding this matter.
Regards, Monika Kirkova, Infragistics