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.

Grid/Editing/Dialog Editing - DropDownList

Thread ID:

Created:

Updated:

Platform:

Replies:

120201 Sep 10,2015 05:39 AM Sep 21,2015 10:27 AM ASP.NET Web Forms 7
loading
Tags: Grid
Pratheep
Asked On September 10, 2015 05:39 AM



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 [Syncfusion]
Replied On September 11, 2015 07:09 AM

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
Replied On September 11, 2015 02:38 PM

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 [Syncfusion]
Replied On September 14, 2015 08:21 AM

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
Replied On September 17, 2015 12:07 AM

Hi

Thanks, working fine 

Pratheep


Saravanan Arunachalam [Syncfusion]
Replied On September 18, 2015 06:21 AM

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
Replied On September 18, 2015 08:23 PM

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 [Syncfusion]
Replied On September 21, 2015 10:27 AM

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


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.

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.

;