Custom editor value not sticking

[Brian Vallelunga]

I'm trying to get a custom editor (DropDownList) to work, but am not having any luck. I have the following setup:

Grid:
DataSource: a remote GET request that works fine
In the grid's datasource, I have a field called ProjectId that is set to editable and of type "number"

The grid displays all of the data just fine. When I click on a cell to switch it into edit mode, I'm showing a drop down that remotely gets a list of projects to display, based on the value of the ClientId field for that row. The code is below:

var projectsDataSource = new kendo.data.DataSource({

  transport: {

    read: {

      url: "/ProjectsDataUrl";

      dataType: "json"

    }

  }

})

 

function projectsEditor(container, options) {

  if (options.model.ClientId !== null) {

    projectsDataSource.transport.options.read.data = {

      clientId: options.model.ClientId

    };

     projectsDataSource.read();

    return ($("<input name='ProjectId' data-bind='value:" + options.field + "' />")).appendTo(container).kendoDropDownList({

      dataSource: projectsDataSource,

      autoBind: false,

      dataTextField: "Name",

      dataValueField: "Id",

      optionLabel: "Select Project"

    }).data("kendoDropDownList");

  }

};

I'm only showing the editor if the ClientId field is not null. The drop down list displays fine, but after making my selection and clicking away, the underlying data does not get updated. I'm really not sure what I'm doing wrong here.

[Alexander Valchev]

Hi Brian,

You code looks OK, but there is a syntax mistake in the read transport:

url: "/ProjectsDataUrl"; //semi column will throw syntax error
dataType: "json"

I tried to reproduce the problem in this jsFiddle example, but to no avail. Could you please check my demo page and tell me if I missed something?

Greetings,
Alexander Valchev
the Telerik team

[Brian Vallelunga]

I've figured out the problem, but am unsure of why I'm seeing this behavior. It might be a bug. When trying to bind a DDL's value, which is a number, to a field that currently holds null, the new value does not stick. This only seems to occur when using the custom editor.

Instead of sending "null" in my JSON for IDs that don't have a value, I started sending down -1. When doing that, the changes are being recorded properly. I feel like this must be a bug.

[Alexander Valchev]

Hi Brian,

We are not able to reproduce this issue, is it possible to send us a sample but working project that illustrates the case? Thus way we would be able to examine what is causing this behaviour and provide you with more information and if possible a solution for the problem. Please provide such example and we check it right away.

Greetings,
Alexander Valchev
the Telerik team

[Jaben]

I'm noticing this same behavior -- thank you Brian for your solution.

Here is what worked for me with a "Id" lookup (unlike your example Alexander with the text lookup).

editor: function(container, options) {
    if (options.model.AreaId === null) {
        options.model.AreaId = -1; 
    }
 
    $('<input id="AreaLocationCombo" data-bind="value:' + options.field + '"/>')
        .appendTo(container)
        .kendoDropDownList({
            dataTextField: "Tag",
            dataValueField: "AreaId",
            autoBind: false,
            dataSource: {
                autoSync: false,
                data: self.moduleAreaList,
                schema: {
                    model: {
                        id: "AreaId",
                        fields: {
                            AreaId: { type:"number", editable: false, nullable: true },
                            Tag: { validation: { required: true } }
                        }
                    }
                }
            }
        });
},