如何在asp.net mvc中禁用kendo编辑器

时间:2013-03-03 05:52:38

标签: kendo-ui

如何禁用kendo编辑器或将其设为只读?我尝试使用HTML属性但没有运气(或者我仍然做得对)

                    @(Html.Kendo().Editor()
                    .Name("Text")
                    .Value(@detail.SRoomInformation)
                    .Tools(tools => tools.Clear())
                    )

3 个答案:

答案 0 :(得分:7)

如果您想知道为什么没有这样的选项,例如启用/禁用 - 因为html可以简单地显示为html或文本 - 编辑器提供的所有工具都不需要,使用这样的小部件毫无意义。编辑器意味着它可以帮助您编辑;)

如果您确实要禁用它,可以在初始化编辑器后使用以下代码行

e.g。

@Html.Kendo().Editor().Name("test")


<script type="text/javascript">
    $(function () {
        $($('#test').data().kendoEditor.body).attr('contenteditable', false)
    })        
</script>

答案 1 :(得分:4)

不知道为什么回答的问题对我不起作用。但无论如何,它引发了类似的事情:

@(Html.Kendo().EditorFor(model => model.Description) )
@Html.ValidationMessageFor(model => model.Description)
<script>
    // this piece of code neeeeeeeds to be heeeeere! Don't move it
    $(document).ready(function () {
        var editor = $('#Description').data('kendoEditor');
        editor.body.contentEditable=false;
    });
</script>

这很有效!:)玩得开心!

答案 2 :(得分:1)

当我尝试实施这些解决方案时,上述解决方案都不适用于我。似乎Telerik提供了一个非常简单的解决方案,涉及覆盖的div,如下所述:http://docs.telerik.com/kendo-ui/controls/editors/editor/how-to/enable-and-disable-editor

在实践中,这导致我想禁用的控件旁边有一个额外的div:

<div ng-if="readonly/disabled_Condition == true">
     <div id="overlay" style="width:100%;height:250px; top:100; position:absolute; background-color: black; opacity:0.1; z-index:2;"></div>
     <textarea kendo-editor k-options="options.DutyEditor" ng-model="item.TasksHtml"></textarea>
</div>

一个问题是将重叠div的大小与kendo编辑器的大小相匹配。就我而言,这是一个简单的100%宽度和250px高度,所以我很幸运。

认为这可能有助于某人!