let itemElem: HTMLElement;
let itemObj: DropDownList;
let items: { [key: string]: Object }[] = [
{ text: "France", value: "item1" },
{ text: "Germany", value: "item2" },
{ text: "Brazil", value: "item3" },
{ text: "Belgium", value: "item4" },
{ text: "Switzerland", value: "item5" }];
let grid: Grid = new Grid(
{
dataSource: orderDataSource,
editSettings: { allowEditing: true, allowAdding: true, allowDeleting: true, mode: 'Normal' },
allowPaging: true,
pageSettings: { pageSize: 6, pageCount: 5 },
toolbar: ['Add', 'Edit', 'Delete', 'Update', 'Cancel'],
columns: [
. . .
. . .
{
field: 'ShipCountry', headerText: 'Ship Country',width: 160, edit:{
create: () => {
itemElem = document.createElement('input');
return itemElem;
},
read: () => {
return itemObj.text;
},
destroy:() =>{
itemObj.text;
},
write: (e) => {
var Data = e.rowData.ShipCountry;
itemObj = new DropDownList({
dataSource: items,
fields : { value:'value' , text :'text'},
text: Data ,
floatLabelType: 'Never'
});
itemObj.appendTo(itemElem);
}
}
],
});
grid.appendTo('#Grid'); |
index.ts
{ field: 'ShipCountry', headerText: 'Ship Country',width: 160, edit:{ create: () => {
itemElem = document.createElement('input');
return itemElem;
},
write: (e) => { if(e.rowData.CustomerID == "VINET"){
var Data = e.rowData.ShipCountry;
itemObj = new DropDownList({
dataSource: items,
fields : { value:'value' , text :'text'},
text: Data ,
floatLabelType: 'Never'
});
itemObj.appendTo(itemElem);
}
else{
var Pole = e.rowData.ShipCountry;
itemElem.value = Pole;
}
}
}
}
],
});
grid.appendTo('#Grid'); |