DropDownList with MVVM binding to the data-value-field and not the object

[florim]

I'm binding to genders collection DataSource that is exposed through ViewModel
 

var genderDataSource = new kendo.data.DataSource({
       transport: {
           tbl: azureService.client.getTable('XconfigGender'),
           read: function (options) {
               console.log('read');
               //{ FirstNameEn: options.data.filter.filters[0].value }
               this.tbl.read({ SearchString: "*" }).done(
                   function (d) {
                       options.success(d);
                   });
           },
           update: function (options) {
               console.log('update');
               //var mod = kendo.stringify(options.data.models[0]);
               this.tbl.update(options.data.models[0]).done(function (d) {
                   options.success(d);
               }, function (err) {
                   options.error(err);
               });
           },
           create: function (options) {
               this.tbl.insert(options.data.models[0]).done(function (d) {
                   options.success(d);
               }, function (err) {
                   options.error(err);
               });
           },
       },
       schema: {
           model: { id: "id" }
       }
   });

Html:

<select data-role="dropdownlist" data-text-field="GenderEn" data-value-field="id" data-bind="source:genders, value: selectedItem.GenderID"></select>

But when a try to save selectedItem.GenderID its not bound to the value of dropdown list but to the object that is selected (instead selectedItem.GenderID to be example 2 it is the object with id and a description  so is it example {id:2, GenderEn:"Male"} ).

So my question is how do i bound to the data-value-field and not the object.

Sorry for my bad Englisht

[Atanas Korchev]

Hi,

 You can use the newly introduced data-value-primitive attribute which controls that behavior.
<select data-role="dropdownlist" 
          data-bind="source: items, value: value" 
          data-value-primitive="true"  
          data-text-field="name"
          data-value-field="id"></select>

Here is a sample demo: http://jsbin.com/eqimiz/1/edit

Regards,
Atanas Korchev
Telerik