网格编辑模式下的 Kendo UI 下拉列表答案

【问题标题】：Kendo UI Dropdownlist in Grid Edit mode网格编辑模式下的 Kendo UI 下拉列表
【发布时间】：2013-11-25 20:27:53
【问题描述】：

基本上，我有一个 Kendo UI Dropdownlist 作为我的第一个网格列，名为“instrumentName” 在弹出式编辑模式下，我可以在下拉菜单中看到正确的仪器名称，但是当我更改值时出现了一个问题：

只要我选择了一个新的仪器 - 仪器 ID 就会显示在网格上（在背景中）。更新后的 INSTRUMENT NAME 应出现在网格上。

一旦我点击更新，它不会显示仪器名称，而是显示仪器 ID（这是一个数字）。

一些代码sn-ps：

 instrDropDown.value(e.model.instrumentId);
 nodeGrid = $("#curvesGrid").kendoGrid({
      dataSource: new kendo.data.DataSource({ ... });
      columns: [
        {
            field: "instrumentName",
            editor: instrumentsDropDownEditor, template: "#=instrumentName#"
        },
        {
            field: "instrumentTypeName"      
        },
        edit: function(e){
            var instrDropDown = $('#instrumentName').data("kendoDropDownList"); 
            instrDropDown.list.width(350);  // widen the INSTRUMENT dropdown list
            if (!e.model.isNew()) {
                instrDropDown.value(e.model.instrumentId);
            }
        }
  });

这是我的那个下拉菜单的模板编辑器：

function instrumentsDropDownEditor(container, options) {

    // INIT INSTRUMENT DROPDOWN !
    var dropDown = $('<input id="instrumentName" name="instrumentName">'); 
    dropDown.appendTo(container);
    dropDown.kendoDropDownList({
        dataTextField: "name",
        dataValueField: "id",
        dataSource: {
            type: "json",
            transport: {
                read: "/api/breeze/GetInstruments"
            },
        },
        pageSize: 6,
        //select: onSelect,
        change: function () { },
        close: function (e) {

        },
        optionLabel: "Choose an instrument"
    }).appendTo(container);
}

在更改下拉菜单时我需要做一些特别的事情吗？

谢谢。鲍勃

【问题讨论】：

标签： kendo-ui kendo-grid

【解决方案1】：

dataFieldValue 将被保存为DropDownList 的值。如果要保存name，则应将dataValueField 定义为name。

关于后台更新，这是默认行为，因为这是一个 ObservableObject，因此更改会自动传播。如果您不希望这样做，您可能应该尝试使用 fake 变量作为下拉菜单，并在 save 事件中将其复制到实际字段。你真的需要这个吗？

【讨论】：