Grid/Editing/Dialog Editing - DropDownList

[Pratheep]

Hi

Populate list items in the DropDownList not working (showing empty Dropdown list)

please find the attachment 

Thanks

Pratheep

Attachment: DialogEditing_20c01fc6.rar

[Saranya Sivakumar]

Hi Pratheep,

Thanks for contacting Syncfusion support.

We have analyzed your provided sample and we would like to let you know that while using Dialog editing in Grid we have to map the DataSource in the code behind by defining the Dropdownlist column as highlighted in the following code snippet.

<code>

  private void BindDataSource()

        {

            List<ship> shiplist = new List<ship>();

            shiplist.Add(new ship() { Id = "1", Text = "UK" });

            shiplist.Add(new ship() { Id = "2", Text = "USA" });

            shiplist.Add(new ship() { Id = "3", Text = "CANADA" });

            shiplist.Add(new ship() { Id = "4", Text = "INDIA" });

            . . .

            this.OrdersGrid.Columns[2].DataSource = shiplist;

            this.OrdersGrid.DataSource = order;

            this.OrdersGrid.DataBind();

        }

</code>

Then we have to bind the DataSource to the Dropdownlist control in the Action complete event of our Grid control as shown in the following code snippet.

<code>

function complete(args) {

           

                . . .

                $("#ShipCountry").ejDropDownList({ width: '116px', dataSource: args.model.columns[2].dataSource, fields: { text: "Text", value: "Text",id:"Id" } });

              

                . . .

        }

</code>

For your convenience we have modified your sample and the same can be downloaded from the following location.

http://www.syncfusion.com/downloads/support/forum/120201/ze/DialogEditing787582829

Kindly check with the above sample and let us know if you have any other queries.

Regards,

Saranya.S

[Pratheep]

Hi

HTML page   DropdownList binding working fine , but content page  DropdownList binding not working 

Please find the attachment 

Thanks

Pratheep

Attachment: DialogEditing787582829_a0a58738.rar

[Saravanan Arunachalam]

Hi Pratheep,

On analyzing your sample, you have directly rendered the ejDropDownList in the template for dialog editing, which may be the cause of the issue. So we suggest you to use html element in the template and then render the ejDropDownList control by using the ActionComplete event of Grid. Please refer to the following code example.

[Template]

<script type="text/template" id="template">

                . . . . . . .

                <td style="text-align: left">

                      <input type="text" id="ShipCountry"/> <%--use html element to render DropDownList--%>

                </td>

                 . . . . . . .

</script>

[Render Dropdownlist]

function complete(args) {

              

                    . . . . . .

                    $("#ShipCountry").ejDropDownList({ width: '116px', dataSource: args.model.columns[0].dataSource, fields: { text: "Text", value: "Text", id: "Id" } });

                    //bind dataSource for dropdownlist

                    . . . . . .

                }

           }

And also, no need to specify the column’s EditType property of Grid while using the editing template. 

We have modified the sample and it can be downloaded from the following link.

http://www.syncfusion.com/downloads/support/forum/120201/ze/DialogEditing1803454169

Regards,

Saravanan.A

[Pratheep]

Hi

Thanks, working fine 

Pratheep

[Saravanan Arunachalam]

Hi Pratheep,

Thanks for your update.
We are happy to hear that your issue has been resolved.
Please get back us if you need any further assistance. We will happy to assist you.
Regards,
Saravanan.A

[Pratheep]

Hi

DropdownList binding working fine in content page  - EditAction (Add new record or Edit record) it's is possible to get ejDropDownList SelectedCode(Id -value)

            List<ship> shiplist = new List<ship>();

            shiplist.Add(new ship() { Id = "0001", Text = "UK" });

            shiplist.Add(new ship() { Id = "0002", Text = "USA" });

            this.OrdersGrid.Columns[0].DataSource = shiplist;

            this.OrdersGrid.DataSource = order;

            this.OrdersGrid.DataBind();

ejDropDownList if i select  UK - Edit Action i need to get 0001 (Id value)

Please find the attachment

Thanks

Pratheep

Attachment: DialogEditing_ecc7bed6.rar

[Saravanan Arunachalam]

Hi Pratheep,

We have analyzed your query and we suspect that you want to pass the DropDown Control’s selectedValue to the server instead of selectedText. We suggest to use field property of of Dropdown Control to set the “Id” Property as “value” of Dropdown. Please refer to the following code example.

function complete(args) {

                    . . .

                    $("#ShipCountry").ejDropDownList({ width: '116px', dataSource: args.model.columns[0].dataSource, fields: { text: "Text", value: "Id", id: "Id" } });

").ejDropDownList("setSelectedValue", args.row.children().eq(1).text());

                    . . .

}

Since the value of Dropdown control is different from text, the value would be stored in Grid Content. To Store the Dropdown control Selected value in Grid Content, we have changed the data (ShipCountry) as selectedText in the datasource of DropDownList by using “ActionBegin” event of Grid.

Please refer to the following code example.

<ej:Grid ID="OrdersGrid" runat="server" AllowPaging="True" OnServerEditRow="EditEvents_ServerEditRow" OnServerAddRow="EditEvents_ServerAddRow"

                    OnServerDeleteRow="EditEvents_ServerDeleteRow">

                    <ClientSideEvents ActionComplete="complete" EndAdd="endAdd" EndDelete="endDelete" EndEdit="endEdit" ActionBegin="begin" />

        . . .           

 </ej:Grid>

function begin(args) {

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

                        var drop = $("#ContentPlaceHolder1_OrdersGrid_dialogEdit .e-editedrow").find("#ShipCountry").ejDropDownList("instance")

                        var data = drop.model.dataSource;

                        var dataVal = drop.getSelectedValue();

                        for (var i = 0; i < data.length; i++) {

                            if (data[i].Id == dataVal)

                                args.data.ShipCountry = data[i].Text;

                        }

                    }

                }

 

We have created the sample that can be downloaded from the following link:

http://www.syncfusion.com/downloads/support/forum/120201/ze/F120201(modified)-1710673858

Regards,

Saravanan.A