I have license.I need multidropdownlist in Ejgrid inlineform.kindly help

Question

Hai Synfusion, I have used given code for Inline template form. If i click cell template form came but multidropdownlist not showed. showing dropdownlist please give solution constructor(private _httpService: Http, private router: Router, public toastr: ToastsManager, vcr: ViewContainerRef, private spinner: NgxSpinnerService) { //, inlineFormTemplateID: "#template" this.editSettings = { allowEditing: true, allowAdding: true, allowDeleting: true, editMode: "inlineform" }; this.toolbarItems = { showToolbar: true, toolbarItems: ["cancel"] }; this.scrollSettings = { width: 1270 }; this.resizeSettings = { allowResizing: true, resizeMode: "normal" }; var datamanager = new ej.DataManager({ url: ROOT_URL + '/Wishlist/GetAllLocation', adaptor: new ej.WebApiAdaptor() });}-----------------

--------------------------

Kuralarasan Muthusamy · Answer

Hi Venkatesan, 

Thanks for contacting Syncfusion support. 

In your update, you mentioned you have used inline template form in your project. But your given code snippet shows you have used inlineForm editMode in your project. So please ensure that which one is you want to use.  

According to your query, we found that you want to use multi select dropDown in Grid. You need to use grid EditTemplate to render the multi select dropDownList in grid column. We have already discussed about this topic in our following kb documentation, 

https://www.syncfusion.com/kb/4809 

In this kb we have used inline edit mode for editing. So we have prepared the sample with inlineform edit mode and multi select dropDownList and that sample can be downloadable from the below link, 

Sample: http://www.syncfusion.com/downloads/support/directtrac/general/ze/refresh-1086543713.zip 

Please refer the following link to know about EditTemplate property of Grid: 

https://help.syncfusion.com/angular/grid/editing#cell-edit-template 

Please let us know, If you need further assistance on this, 

Regards, 
Kuralarasan M.

venkatesan · Answer

Hai synfusion ,

Thank you for your comment . But i tried not working properly. I am using InlineForm

following code i have used. but multidropdownselection option didn't come. so kinldy help

this.editSettings = { allowEditing: true, allowAdding: true, allowDeleting: true, editMode: "inlineform" };

var datamanager = new ej.DataManager({

url: ROOT_URL + '/Wishlist/GetAllLocation',

adaptor: new ej.WebApiAdaptor()

});

<e-column field="locationName" headerText="Location Name" width="80" ej-dropdownlist editType="dropdownedit" showCheckbox="true" allowMultiSelection="true" [dataSource]="locationValues" [fields]="locationfieldsvalues"></e-column>

Kuralarasan Muthusamy · Answer

Hi Venkatesan, From your given code, we found that you have used ejDropDownList Api’s in grid column (like allowMultiSelection, showCheckbox). This api will not work in grid. So we have used grid EditTemplate to render the dropDownList inside the grid column with this api. Please refer the following code snippet: .html page:

......

In this code we have used editTemplate property of the to render the dropDownList in that column. .ts page: export class GridComponent { public editTemp; constructor() { this.editTemp = { create: function() { return ""; }, read: function(args) { return args.ejDropDownList("getValue").split(","); }, write: function(args) { var selIndex = []; if (args.rowdata != undefined) { for (var i = 0; i < args.rowdata["ShipCity"].length; i++) for (var j = 0; j < data.length; j++) { if (args.rowdata["ShipCity"][i] == data[j]) { selIndex.push(j); break; } } } args.element.ejDropDownList({ width: "100%", dataSource: gridData, fields: { id: "text", text: "text", value: "value" }, showCheckbox: true, allowMultiSelection: true, selectedItems: args.rowdata !== undefined ? selIndex : "" }); } } } } In here we have rendered the ejDropDownList inside that editTemplate column after that we have used the dropDownList Api’s (i.e allowMultiSelection, showCheckbox) inside this ejDropDownList. This all are achieved by using grid editTemplate. So we suggest you to use grid editTemplate to achieve your requirement. We have already attached our sample in our previous update. In that sample we have used this editTemplate property to achieve this requirement. So If you have any doubt, please refer that sample and following kb for further assistance. https://www.syncfusion.com/kb/4809 We have explained, “How to set the multi select dropdown as edit type for a column” in this kb. So please refer this kb also to achieve your requirement. Refer the following link to know about editTemplate property of the Grid: https://help.syncfusion.com/angular/grid/editing#cell-edit-template Regards, Kuralarasan M.