Javascript 如何使用ComboBox作为剑道UI网格列？

我正在使用剑道网格，我正在尝试使名称字段成为一个有自己数据源的组合框。我没有收到javascript错误，但是当我在网格中编辑name字段时，它没有显示组合框。它仍然显示一个输入字段

$(function () {

    console.log("ready");

    var datasource = new kendo.data.DataSource({
        transport: {
            read: {
                url: "", // Returns all items
                dataType: "json"
            }
        },
        pageSize: 10,
        schema: {
            model: {
                id: "Id",
                fields: {
                    Id: { type: "number", editable: false, nullable: false, visible: false },
                    Name: { type: "string", editable: true, nullable: false, validation: { required: true} },
                    Description: { type: "string", editable: true, validation: { required: true} }                        
                }
            }
        }
    });

    var grid = $("#grid").kendoGrid({
        dataSource: datasource,
        editable: true,
        height: 400,
        columns: [
            { field: "Id", width: 200 },
            {                    
                field: "Name",
                editor: function (container, options) {     // This is where you can set other control types for the field.                                                                   
                    $('< input name="' + options.field + '"/>').appendTo(container).kendoComboBox({
                        dataSouce: [{ Id: "1", Name: "MaryMaryMary" }, { Id: "2", Name: "John"}],
                        dataValueField: "Id",
                        dataTextField: "Name",                            
                    });
                }
            }
        ],
        dataBound: function (e) {
            console.log("DataBound");
        }
    });

}); 

---

我没有收到任何javascript错误

您使用的是什么版本的KendoUI？只有最新的SP1和三月测试版具有自定义编辑器支持：

此外，我

将

和

替换为

和

更正了为KendoComboBox创建的拼写错误的“dataSouce”属性

---

我创建的应该会让你走上正确的方向：

你使用的是什么版本的KendoUI？只有最新的SP1和三月测试版具有自定义编辑器支持：

此外，我

将

和

替换为

和

更正了为KendoComboBox创建的拼写错误的“dataSouce”属性

我创建的，应该让你朝着正确的方向前进：

为那些“迫切”需要自定义编辑器并且不能等待下一个版本的人，就像我一样…：-）

…这是我的解决方法。。。将kendo.all.js的第12320行更改为：

fields: { field: column.field, format: column.format, editor: column.editor },

…瞧！现在，该列的“编辑器”设置生效

---

我在

那是2012年1月6日，目前的版本是v2011.3.1129

，适用于那些“迫切”需要自定义编辑器并且迫不及待地等待下一个版本的人，就像我一样…：-）

…这是我的解决方法。。。将kendo.all.js的第12320行更改为：

fields: { field: column.field, format: column.format, editor: column.editor },

…瞧！现在，该列的“编辑器”设置生效

---

我在

那是2012年1月6日，当前版本是v2011.3.1129。我们发布了一个演示如何做到这一点的版本。

我们发布了一个演示如何做到这一点的版本。

我正在使用MVC4
在网格中：

创建EditorTemplateName=Productname。
鉴于共享：

@(Html.Kendo().ComboBox()
             .Name("Ten_dvt")
             .DataValueField("Ten_dvt")
       .DataTextField("Ten_dvt")
       .Filter(FilterType.Contains)
        .HighlightFirst(true)
       .DataSource(source =>
       {
           source.Read(read =>
           {
               read.Action("Dm_dvt", "Combo");
           });
       })   .Events(e => e.Select("Select_Ma_dvt").Change("Change_Ma_dvt"))
   .HeaderTemplate("<table style=\"width:100%\"><tr><td  align=\"left\"
   style=\"width:30%\">" + @Tcommont("Ma") + "</td><td align=\"left\"
   style=\"width:70%\">" + @Tcommont("Ten") + "</td></tr></table>")
        .Template("<table style=\"width:100%\"><tr><td  align=\"left\" style=\"width:30%\">" + "#: data.Ma_dvt #" + "</td><td align=\"left\"
   style=\"width:70%\">" + "#: data.Ten_dvt #" + "</td></tr></table>" +
   "<div style='width:0px; height:0px;
   overflow:hidden'>;#:data.Ma_dvt#;#:data.Ten_dvt#;</div>") )

及

最后一个网格显示名称，然后选择Id或Ma将选择隐藏

我正在使用MVC4
在网格中：

创建EditorTemplateName=Productname。
鉴于共享：

@(Html.Kendo().ComboBox()
             .Name("Ten_dvt")
             .DataValueField("Ten_dvt")
       .DataTextField("Ten_dvt")
       .Filter(FilterType.Contains)
        .HighlightFirst(true)
       .DataSource(source =>
       {
           source.Read(read =>
           {
               read.Action("Dm_dvt", "Combo");
           });
       })   .Events(e => e.Select("Select_Ma_dvt").Change("Change_Ma_dvt"))
   .HeaderTemplate("<table style=\"width:100%\"><tr><td  align=\"left\"
   style=\"width:30%\">" + @Tcommont("Ma") + "</td><td align=\"left\"
   style=\"width:70%\">" + @Tcommont("Ten") + "</td></tr></table>")
        .Template("<table style=\"width:100%\"><tr><td  align=\"left\" style=\"width:30%\">" + "#: data.Ma_dvt #" + "</td><td align=\"left\"
   style=\"width:70%\">" + "#: data.Ten_dvt #" + "</td></tr></table>" +
   "<div style='width:0px; height:0px;
   overflow:hidden'>;#:data.Ma_dvt#;#:data.Ten_dvt#;</div>") )

及

---

---

最后一个网格显示名称，然后选择Id或Ma将选择隐藏

当我单击编辑时，它不会在名称字段中给我一个组合框。它只是给了我一个输入框。当你把输入添加为@Frankie:那么，Frankie，你是升级了你的版本还是使用了黑客？@J.Bruni我实际上升级了版本。谢谢。好吧，这很糟糕，因为是我的回复建议升级与Bruni的黑客相比。当我点击编辑时，它不会在名称字段中给我一个组合框。它只是给了我一个输入框。当你把输入添加为@Frankie:那么，Frankie，你是升级了你的版本还是使用了黑客？@J.Bruni我实际上升级了版本。谢谢。好吧，这很糟糕，因为是我的回复建议与Bruni的相比升级以进行黑客攻击。我使用的是旧版本2011.3.1129的自定义编辑器（只更改了一行代码），我不明白。版本2011.3.1407是KendoUI的官方service pack发行版（非测试版），其中包含您提到的单行代码更改以及。你为什么不干脆用它来代替呢？1）它发生在1月份，SP发布之前；2） 你能帮我付一张商业执照吗？：）我使用的是开源许可证（GPL）——所以，这是我可以下载和使用的许可证。因为Frankie没有特别提到它，所以我假设他为产品付费（就像我一样）。你的黑客攻击适用于那些使用开源版本的人，我肯定下周（大约）会看到一个新版本。我使用的是旧版本2011.3.1129的自定义编辑器（只更改了一行代码），我不明白。版本2011.3.1407是KendoUI的官方service pack发行版（非测试版），其中包含您提到的单行代码更改以及。你为什么不干脆用它来代替呢？1）它发生在1月份，SP发布之前；2） 你能帮我付一张商业执照吗？：）我使用的是开源许可证（GPL）——所以，这是我可以下载和使用的许可证。因为Frankie没有特别提到它，所以我假设他为产品付费（就像我一样）。你的破解方法适用于那些使用开源版本的人，我相信下周（大约）会有一个新版本。这个例子显示了带有“产品名称”、“类别”和“价格”列的网格。但是在源代码中我看到columns.Bound（p=>p.OrderID）；columns.Bound（p=>p.Employee）.ClientTemplate（“#=Employee.EmployeeName#”）；columns.Bound（p=>p.ShipAddress）；此示例显示了带有“产品名称”、“类别”和“价格”列的网格。但是在源代码中我看到columns.Bound（p=>p.OrderID）；columns.Bound（p=>p.Employee）.ClientTemplate（“#=Employee.EmployeeName#”）；columns.Bound（p=>p.ShipAddress）；欢迎来到StackOverflow。仅供参考，本网站倾向于不加解释地阻止代码转储。添加一些关于此代码为何解决询问者问题的解释将非常有用。欢迎使用StackOverflow。仅供参考，本网站倾向于不加解释地阻止代码转储。添加一些关于此代码为何解决询问者问题的解释将非常有用。

function Select_Ma_dvt(e) {    var _Arr = e.item.text().split(";");
                          var grid = $("#gridItem2").data("kendoGrid");
                          var _dataItem = grid.dataItem(grid.select());
                          _dataItem.set("Ma_dvt", _Arr[1]);
                          break; }