Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
605
How to set the display value of the igx-combo in the igx-grid?
posted

We are using igx-combo in a cell editor within igx-grid and have run into an issue that we cannot figure out: how to get the existing display value from the cell to display in igx-combo when it enters edit mode?

A little background:

We are binding a set of records to the combo that have a numeric value and a string display value. The display value is stored in a different column within the row data, so the cell display configuration simply pulls that value when not in edit mode. Roughly:

            <ng-template igxCell let-cell="cell">
                <div>{{cell.rowData[col.displayColumnName]}}</span></div>
            </ng-template>

The cell editor is setup as follows (display-only properties removed):

            <ng-template igxCellEditor let-cell="cell">
                <igx-combo [(ngModel)]="cell.editValue" [data]="lookupLists[col.columnName]" [displayKey]="'Description'" [valueKey]="'LookupListID'">
                </igx-combo>
            </ng-template>

The issue is that prior to editing, there is a value in the cell:

But when we enter edit mode on the cell, the value is not selected in the combo text area or in the dropdown:

After a little more experimentation, we realized that the issue is that igx-combo expects (and returns) an array of values, but we only have a single value available.

We are using the guidance in the combo documentation topic to only allow a single value to be selected, but that guidance does not include information on how we go about binding a single value to the grid.

We have tried changing both the oldValue in the args of the cellEditEnter method and setting the cell's editValue in that method, but neither are recognized.

We have verified that we can change the value from an array to a single value in the cellEdit method, but we do need to figure out how to assign the appropriate array so the combo shows the correct value.