Manisankar,
Thanks for the reply. Unfortunately I still can't get it to work, it still is not showing any data in the drop down. I've attempted to follow the example and have now got the following code:
app.component.ts
import { Component } from '@angular/core';
import { TheGang, TheGangService } from '../service/thegang.service';
import { Gender, GenderService } from '../service/gender.service';
@Component({
selector: 'app-editgrid3',
templateUrl: './editgrid3.component.html',
styleUrls: ['./editgrid3.component.scss'],
providers: [TheGangService, GenderService]
})
export class EditGrid3Component {
public gridData: any;
public genderData: any;
public groupedColumns: Array<string>;
public filterType;
public pageSettings;
public editSettings;
public toolbarItems;
gangmembers: TheGang[]
genders: Gender[]
constructor(theGangService: TheGangService, GenderService: GenderService) {
this.gangmembers = theGangService.getTheGang();
this.genders = GenderService.getGenders();
this.filterType = { filterType: 'menu' };
this.pageSettings = { pageSize: 5 };
this.editSettings = { allowEditing: true, allowAdding: true, allowDeleting: true, editMode: "dialog", showDeleteConfirmDialog:true };
this.toolbarItems = { showToolbar: true, toolbarItems: ["add", "edit", "delete", "update", "cancel", "search"] };
this.genderData = this.genders;
this.gridData = this.gangmembers;
}
onComplete(event: any) {
if (event.requestType == "beginedit") {
$("#ejControl_0Gender").ejDropDownList({ dataSource: event.model.columns[2].dataSource, fields: { text: "Text", value: "Value" } }).ejDropDownList("setSelectedValue", event.row.children().eq(2).text());
}
}
}
app.component.html
<h1>Edit Grid 3</h1>
<p>Edit with a modal popup diaog</p>
<ej-grid [allowPaging]="true" [pageSettings]="pageSettings" [allowSelection]="true"
[allowGrouping]="true" [allowSorting]="true" [allowFiltering]="true" [allowResizing]="true" [allowReordering]="true" [allowSearching]="true"
[allowMultipleExporting]="true" [showColumnChooser]="true"
[toolbarSettings]="toolbarItems" [editSettings]="editSettings"
[filterSettings]="filterType" [groupSettings.groupedColumns]="groupedColumns" [dataSource]="gridData"
(actionComplete)="onComplete($event)" >
<e-columns>
<e-column field="ID" [isPrimaryKey]="true" editType="numericedit" headerText="ID" width="10" textAlign="right"></e-column>
<e-column field="Firstname" headerText="First Name" width="40"></e-column>
<e-column field="Surname" headerText="Surname" width="40"></e-column>
<e-column field="Gender" editType="dropdownedit" [editParams] ="{enableAnimation: true}" dataSource="genderData" headerText="Gender" width="10"></e-column>
<e-column field="DateOfBirth" editType="datepicker" format="{0:dd/MM/yyyy}" headerText="Date of Birth" width="20"></e-column>
</e-columns>
</ej-grid>
Any idea why this is still not working for me?
Dave
