Kendo ui 必须通过编程将网格设置为可编辑=false

超级简单的概念

在某些情况下，我的可编辑栅格和详图栅格必须设置为只读。。。所以我想做一些类似的事情：

var grid = $("#grid").data("kendoGrid");
grid.options.editable = false;

当然这不起作用，因为它太简单了

---

谢谢你的帮助

我建议您使用两个网格：一个只读网格和一个读写网格，但只有一个可见。两者都共享数据源定义，因此它们总是同步的。当要从一个更改为另一个时，可以隐藏可见对象并显示另一个

示例：我创建了两个网格，完全相同的定义，不同之处在于一个是隐藏的，一个是可见的，一个是可编辑的，另一个不是。因为两者共享相同的数据源，所以它实际上工作得非常完美，因为在一个页面中更改另一个页面会更改另一个页面，编辑一个页面会更新另一个页面

比如：

var grid = $("#grid").data("kendoGrid");
grid.options.editable = false;

1-用于切换可见性的CSS定义：

.ob-hide {
    display : none;
}

2-数据源定义：

var ds = new kendo.data.DataSource({
    transport : {
        read : {
            url: ...
        },
        update : {
            url: ...
        },
        create : {
            url: ...
        },
        destroy : {
            url: ...
        }
    },
    pageSize: 10,
    schema  : {
        model: {
            id : ...,
            fields: {
                id       : { type: '...' },
                ...
            }
        }
    }
});

接下来是两个网格：

$("#grid-editable").kendoGrid({
    editable: "inline",
    dataSource : ds,
    ...
}

$("#grid-not-editable").kendoGrid({
    editable: false,
    dataSource: ds,
    ...
});

$("#grid-editable").addClass("ob-hide");

最后是切换模式的功能：

function gridEditable() {
    $("#grid-editable").removeClass("ob-hide");
    $("#grid-not-editable").addClass("ob-hide");
});

function gridNotEditable() {
    $("#grid-editable").addClass("ob-hide");
    $("#grid-not-editable").removeClass("ob-hide");
});

---

看到它在这里运行：

我建议您使用两个网格：一个只读网格和一个读写网格，但只有一个可见。两者都共享数据源定义，因此它们总是同步的。当要从一个更改为另一个时，可以隐藏可见对象并显示另一个

示例：我创建了两个网格，完全相同的定义，不同之处在于一个是隐藏的，一个是可见的，一个是可编辑的，另一个不是。因为两者共享相同的数据源，所以它实际上工作得非常完美，因为在一个页面中更改另一个页面会更改另一个页面，编辑一个页面会更新另一个页面

比如：

var grid = $("#grid").data("kendoGrid");
grid.options.editable = false;

1-用于切换可见性的CSS定义：

.ob-hide {
    display : none;
}

2-数据源定义：

var ds = new kendo.data.DataSource({
    transport : {
        read : {
            url: ...
        },
        update : {
            url: ...
        },
        create : {
            url: ...
        },
        destroy : {
            url: ...
        }
    },
    pageSize: 10,
    schema  : {
        model: {
            id : ...,
            fields: {
                id       : { type: '...' },
                ...
            }
        }
    }
});

接下来是两个网格：

$("#grid-editable").kendoGrid({
    editable: "inline",
    dataSource : ds,
    ...
}

$("#grid-not-editable").kendoGrid({
    editable: false,
    dataSource: ds,
    ...
});

$("#grid-editable").addClass("ob-hide");

最后是切换模式的功能：

function gridEditable() {
    $("#grid-editable").removeClass("ob-hide");
    $("#grid-not-editable").addClass("ob-hide");
});

function gridNotEditable() {
    $("#grid-editable").addClass("ob-hide");
    $("#grid-not-editable").removeClass("ob-hide");
});

---

看到它在这里运行了吗：

通过在所需元素上添加disabled=disabled，我开发了一种更好的样式。将angular JS与剑道一起使用，效果非常好，因为将网格设置为disabled不允许用户编辑它。试试看，没有棱角也可以用

通过在所需元素上添加disabled=disabled，我开发了一种更好的样式。将angular JS与剑道一起使用，效果非常好，因为将网格设置为disabled不允许用户编辑它。试试看，没有棱角也可以用

这是一个伟大的修复。。。我还得到了剑道摧毁可编辑网格的解决方案，如果在不可编辑模式下重新创建。。。因为我没有其他选择，所以我就这么做了。再次感谢你，欧娜白。还有其他的方法吗？我不想添加两个网格。我想禁用现有的网格。这是一个很好的修复。。。我还得到了剑道摧毁可编辑网格的解决方案，如果在不可编辑模式下重新创建。。。因为我没有其他选择，所以我就这么做了。再次感谢你，欧娜白。还有其他的方法吗？我不想添加两个网格。我想禁用现有的网格。