We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Populating a grid, with dropdown edit.

Thread ID:

Created:

Updated:

Platform:

Replies:

120637 Sep 29,2015 06:02 PM UTC Sep 30,2015 06:56 AM UTC JavaScript 1
loading
Tags: ejGrid
Mike Rosenberger
Asked On September 29, 2015 06:02 PM UTC

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 [Syncfusion]
Replied On September 30, 2015 06:56 AM UTC

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 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;