Populating a grid, with dropdown edit.

[Mike Rosenberger]

What is the correct way to populate a grid that has a dropdown edit.

When i put the value as the populated value it displays the value, not the text (when editing it defaults to the right value, just doesn't display it).  When i use the text, when editing it defaults to the first dropdown choice.

 var dateUnit = [{ text: "hours", value : 1}, {text: "days", value: 2}];

 $("#Grid").ejGrid({

                    dataSource: data,

                    toolbarSettings: { showToolbar: true, toolbarItems: [ej.Grid.ToolBarItems.Add, ej.Grid.ToolBarItems.Update, ej.Grid.ToolBarItems.Cancel] },

                    editSettings: { allowEditing: true, allowAdding: true },

                    allowSelection: false,

                    columns: [

                            { field: "Id", isPrimaryKey: true, headerText: "ID", width: 80, textAlign: ej.TextAlign.Center },

                            { field: "Age", headerText: 'Age', width: 80, textAlign: ej.TextAlign.Center },

                            { field: "Unit", headerText: "Unit", textAlign: ej.TextAlign.Center, editType: "dropdownedit", dataSource: dateUnit, defaultValue: 2 }

                    ],

                    actionComplete: function (args) {

                        if (args.requestType == "add") {

                            var drpdwn = this.getContentTable("#detailGrid").find("#detailGridUnit").ejDropDownList("instance");

                            console.log(drpdwn);

                            drpdwn.setSelectedValue(2);

                        }

                    }

                });

[Balaji Marimuthu]

Hi Mike, 

Thanks for contacting Syncfusion support.

To achieve your requirement, please use the ForeignKey column in Grid. Please refer to the sample and code example as below, 
http://jsplayground.syncfusion.com/q2ppu5xf

$("#detailGrid").ejGrid({

            dataSource: data,

            toolbarSettings: { showToolbar: true, toolbarItems: [ej.Grid.ToolBarItems.Add, ej.Grid.ToolBarItems.Update, ej.Grid.ToolBarItems.Cancel] },

            editSettings: { allowEditing: true, allowAdding: true },

            allowSelection: false,

            columns: [

                    { field: "Id", isPrimaryKey: true, headerText: "ID", width: 80, textAlign: ej.TextAlign.Center },

                    { field: "Age", headerText: 'Age', width: 80, textAlign: ej.TextAlign.Center },

                    { field: "Unit", headerText: "Unit", width: 80, textAlign: ej.TextAlign.Center, foreignKeyField: "Unit", foreignKeyValue: "Value", dataSource: dateUnit }

            ],

            actionComplete: function (args) {

                if (args.requestType == "add") {

                    var drpdwn = this.getContentTable("#detailGrid").find("#detailGridUnit").ejDropDownList("instance");

                    console.log(drpdwn);

                    drpdwn.setSelectedValue(2);

                }

            }
        });

Refer to the below Help document, 
http://help.syncfusion.com/js/grid/columns#foreign-key-columns

If we misunderstood your requirement, update how you want to display the values in dropdown. 

Regards,

Balaji Marimuthu