Problems with ComboBox in Flexgrid in an Angular 2 (v5) project

Posted by: ssmith on 23 January 2018, 7:11 pm EST

    • Post Options:
    • Link

    Posted 23 January 2018, 7:11 pm EST

    I’m using FlexGrid and Comboboxes in an Angular 2 project, and I’m not getting the data to appear where I want/expect it to.

    The grid looks like this:

          <wj-flex-grid #flex
            [itemsSource]="groupData"
            [isReadOnly]="false"
            [headersVisibility]="1">
    
          </wj-flex-grid>
    

    Where groupData is an array of objects with Group and Group_Cd attributes, as well as others.

    The cells are defined like this:

    <wj-flex-grid-column [header]="'Group'" [binding]="'Group_Cd'">
         <ng-template wjFlexGridCellTemplate [cellType]="'ColumnHeader'">
                 Group
         </ng-template>
    
         <ng-template wjFlexGridCellTemplate [cellType]="'Cell'" let-row="row" let-cell="cell" let-item="item">
    
                 <wj-combo-box #combo_groups class="wj-combo-box"
                    [itemsSource]="groupValueList"
                    [displayMemberPath]="'group_name'"
                    [selectedValuePath]="'group_id'"
                    [selectedValue]="'Group_Cd'"
                    [isEditable]="false"
                    (lostFocus)="updateLocation(combo_groups,$event,cell.item)">
                 </wj-combo-box>
    
         </ng-template>
    </wj-flex-grid-column>
    

    Where groupValueList looks like this:

      public groupValueList: any = [{ "group_id": "0", "group_name": "" },
                                                    { "group_id": "1", "group_name": "Group One" },
                                                    { "group_id": "2", "group_name": "Group Two" }];
    
    

    The combobox shows the correct list of values (Group One, Group Two and a blank item), and I can select an item and have it display correctly, however when I log out the data on lostFocus nothing appears to be saved anywhere. I can log out groupData, and the Group_Cd attribute isn’t being set.

    What I need to be able to do is select a value from the combo box and have that group_name display in the field for the selection (ie: Group One), and for the group_id for the selection to be stored in the Group_Cd attribute for that data row. I also want to pass that Group_Cd value to the updateLocation function bound to lostFocus so that I can use the Group_Cd value for the selected item to set other values in the same data row based on that Group_Cd value.

    I’m using the current (.405) version of Wijmo 5.

    This is required for an active project very close to launch time, so any feedback on this as soon as possible would be very much appreciated.

    Thanks in advance.

  • Posted 24 January 2018, 3:56 pm EST

    Hi,

    You need to use the selectedCellValue like this [(selectedValue)] and bind it to the cell.item[property]

    Please refer to the attached sample for the same which should fulfill your requirement.

    If the issue persists, please modify the attached sample depicting your issue.

    ~ManishFlexGrid_AutoComplete_DataMap_Filter_fix.zip

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels