设置一个KendoDropDownList所选文本或值(Set the selected text

我使用迪朗达尔和剑道UI。 我现在的问题是我的网编辑弹出事件。 我似乎无法设置我的下拉选择的价值。

我可以调试和检查，我确实也看到e.model.InstrumentName的正确值很好填充。

如何设置在编辑模式下的下拉菜单中的值/文本？

这里是我的网格初始化：

      positGrid = $("#positGrid").kendoGrid({
        dataSource: datasource,         
        columnMenu: false,
        {
            field: "portfolioName", title: "Portfolio Name",
            editor: portfolioDropDownEditor, template: "#=portfolioName#"      
        },
        {
            field: "InstrumentName",
            width: "220px",
            editor: instrumentsDropDownEditor, template: "#=InstrumentName#",
        },
        edit: function (e) {
            var instrDropDown = $('#InstrumentName').data("kendoDropDownList");
            var portfDropDown = $('#portfolioName').data("kendoDropDownList");
            instrDropDown.list.width(350);  // let's widen the INSTRUMENT dropdown list

            if (!e.model.isNew()) {          // set to current valuet                
                //instrDropDown.text(e.model.InstrumentName); // not working...
                instrDropDown.select(1);
                //portfDropDown.text();
            }
        },
          filterable: true,
        sortable: true,
        pageable: true,
        editable: "popup",
    });

这里是我的下拉列表编辑模板：

功能instrumentsDropDownEditor（容器，选项）{

    // 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 () { },
        optionLabel: "Choose an instrument"
    }).appendTo(container);


}

非常感谢鲍勃

Answer 1:

你编辑的配置是电网有点不走运，反正我已经更新了我的提供的代码，避免手动选择ANS：

假设 ：仪器下拉列表编辑器只（留下其他字段为字符串），网格虚拟数据

<div id="positGrid"></div>

<script>
    $(document).ready(function () {    

        $("#positGrid").kendoGrid({
            dataSource: {
                data: [
              { PositionId: 1, Portfolio: "Jane Doe", Instrument: { IID: 3, IName: "Auth2" }, NumOfContracts: 30, BuySell: "sfsf" },
            { PositionId: 2, Portfolio: "John Doe", Instrument: { IID: 2, IName: "Auth1" }, NumOfContracts: 33, BuySell: "sfsf" }
                ],
                schema: {
                    model: {
                        id: "PositionId",
                        fields: {
                            "PositionId": { type: "number" },
                            Portfolio: { validation: { required: true } },
                            Instrument: { validation: { required: true } },
                            NumOfContracts: { type: "number", validation: { required: true, min: 1 } },
                            BuySell: { validation: { required: true } }
                        }
                    }
                }    
            },
            toolbar: [
                { name: "create", text: "Add Position" }
            ],
            columns: [
                { field: "PositionId" },
                { field: "Portfolio" },
                { field: "Instrument", width: "220px",
                    editor: instrumentsDropDownEditor, template: "#=Instrument.IName#" },
                { field: "NumOfContracts" },
                { field: "BuySell" },
                { command: [ "edit", "destroy" ]
            },
            ],
            edit: function (e) {
                var instrDropDown = $('#InstrumentName').data("kendoDropDownList");                
                instrDropDown.list.width(400);  // let's widen the INSTRUMENT dropdown list                
            },
            //sortable: true,
            editable: "popup",
        });
    });

    function instrumentsDropDownEditor(container, options) {
        $('<input id="InstrumentName" required data-text-field="IName" data-value-field="IID" data-bind="value:' + options.field + '"/>')
            .appendTo(container)
            .kendoDropDownList({                                
                dataSource: {
                    type: "json",
                    transport: {
                        read: "../Home/GetMl"
                    }
                },
                optionLabel:"Choose an instrument"
            });
    }
</script>

操作获取JSON在Home控制器dropddown：

public JsonResult GetMl()
        {
            return Json(new[] { new { IName = "Auth", IID = 1 }, new { IName = "Auth1", IID = 2 }, new { IName = "Auth2", IID = 3 } }, 
                JsonRequestBehavior.AllowGet);
        }

文章来源: Set the selected text or value for a KendoDropDownList