Grid with data from DropdownList

[olivier]

Hello,
Im getting a problem that i can't resolve.

So i have a grid, and in one of the field i have a dropdownlist (filled with an other Datasource)

When i select a data in the dropdownlist it works except when i create a new line, when i select  a data in the dropdownlist, i got in the grid [object Object] 

I'm asking how to put in the grid the data i selected in the dropdownlist (SellToName).

here is my code
DataSource:

var customers = [
          {NUMBER:"P001",SellToName:"test1"},
                {NUMBER:"U001",SellToName:"test2"}
]
 var businessList = [
         { NUMBER: "A5678", SellToCustomerNumber: "NOV" }
]

Grid and DropdownList

$(document).ready(function () {


                   //chargement customer list format json
                   var customerDataSource = new kendo.data.DataSource({
                        data: customers
                   });

                   //chargement business list format json
                   var businessListDataSource = new kendo.data.DataSource({
                        data: businessList
                   });

                   //on initialise la grid
                   $("#grid").kendoGrid({
                       dataSource: businessListDataSource,
                       pageable: true,
                       navigatable: true,
                       groupable: true,
                       sortable: true,
                       height: 700,
                       toolbar: ["create"],
                       columns: [
                           { field:"NUMBER",title:"Numero"},
                           { field: "SellToName", title: "Nom", editor: numberDropDownEditor },
                           { command: "destroy", title: " ", width: "90px"}],
                       editable: true
                   });


                   function numberDropDownEditor(container, options) {
                       $('<input  required="required" data-text-field="SellToName" data-value-field="SellToName" data-bind="value:' + options.field + '"/>')
                       .appendTo(container)
                       .kendoDropDownList({
                           autoBind: false,
                           dataSource: customerDataSource
                       }
                       );
                   }

               });

Thank you.

[Kiril Nikolov]

Hi Olivier,

You need to set the schema configuration of the dataSource correctly, in order to get the values displayed. The [object Object]  value is displayed, because the dataSource does not know which property of the object passed to be shown. To read more about the schema configuration please follow this link:

http://docs.kendoui.com/api/framework/datasource#configuration-schema

For your convenience here is a jsBin example which demonstrates a possible implementation. 

http://jsbin.com/abonix/1/
 
Regards,
Kiril Nikolov
Telerik

[olivier]

Hello Kiril Nikolov,

Thank you, it works perfectly with  the schema configuration in the DataSource.

Thank you,
Olivier

[Kiril Nikolov]

Hello Olivier,

I am glad it worked!

If you have any further questions, please do not hesitate to contact us.
 
Regards,
Kiril Nikolov
Telerik