剑道网格没有按预期工作

Posted 2023-05-07

【中文标题】剑道网格没有按预期工作

【英文标题】：Kendo Grid Not working as expected

【发布时间】：2015-05-04 09:18:24

【问题描述】：

这是我的剑道网格代码。我的第一个问题是如果单击编辑，我将其设为可编辑的名称字段：false 不起作用。它正在给文本框。

我的第二个问题是，我想为年龄提供下拉菜单。我该怎么做？

 $("#grid").kendoGrid(
    columns: [
        field: "id", hidden: true ,
       field: "name", title: "Name" ,
       field: "age", title: "Age" ,
         command: ["edit"] 
    ],
    editable: "inline",
    dataSource: [
        id: "1", name: "Andrew", age: "30" ,
        id: "2", name: "Robert", age: "29" ,
        id: "3", name: "Frank", age: "35" 
    ],
    schema: 
        model: 
            id: "id",
            fields: 
                id:  editable: false ,
                name:  editable: false ,
                age:  editable: true 
            
        
    ,
);

【问题讨论】：

@MikeDebela Editable inline 为您提供了在网格行中进行编辑的选项，这正是我所需要的。但对于年龄我想给下拉

模式应该是数据源的一部分......不是网格

这里是链接供参考：demos.telerik.com/kendo-ui/grid/editing-custom

【参考方案1】：

这是完整的代码示例。

var dataSource = new kendo.data.DataSource(
                       pageSize: 20,
                       data: [
                          id: "1", name: "Andrew", age: "30" ,
                          id: "2", name: "Robert", age: "29" ,
                          id: "3", name: "Frank", age: "35" 
                       ],
                       autoSync: true,
                       schema: 
                           model: 
                             id: "id",
                             fields: 
                                id:  editable: false, nullable: true, type: "number" ,
                                name:  editable: false ,
                                age:  
                                    validation:  min: 0, required: true ,
                                    editable: true, 
                                    nullable: true,
                                    type: "number"
                                
                             
                           
                       
                    );

                    $("#grid").kendoGrid(
                        dataSource: dataSource,
                        pageable: true,
                        height: 550,
                        editable: "inline",
                        columns: [
                             field: "name",title: "Name" ,
                             field: "age", title: "Age", width: "180px",
                             command: ["edit"] 
                        ]
                    );

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.1.318/js/kendo.all.min.js"></script>
<link href="http://cdn.kendostatic.com/2014.1.318/styles/kendo.common.min.css" rel="Stylesheet" />



<div id="grid"></div>

【讨论】：

css可能没有被正确引用，上下图标没有出现，但功能是存在的。