2016-03-31 5 views
0

ich ein Kendo-Editor wie unten definiert haben:machen Kendo Editor Read-only

@(Html.Kendo().Editor() 
      .Name("editor") 
      .Tag("div") 
      .Tools(tools => tools 
       .Clear() 
       .Bold().Italic().Underline().Strikethrough() 
       .JustifyLeft().JustifyCenter().JustifyRight().JustifyFull() 
       .CreateLink().Unlink() 
       .InsertImage() 
       .TableEditing() 
       .FontColor().BackColor() 
     ) 
      .Value(@<text> 
      <p> You are inside the editor. And in the editor there are some 
       anchor tags. 
      </p> 

Ich will als Nur-Lese diesen Editor machen und die Anker-Tags im Editor als anklickbare.

Ich schrieb den folgenden Javascript-Code, um dieses Verhalten zu erreichen. Und sogar die Antworten in ähnlichen Beiträgen auf Google-Suche und in Stackoverflow auch gefolgt. Aber keiner funktioniert und Editor ist nicht Readonly. Ich kann immer noch bearbeiten.

Unten ist der Code, den ich versuchte:

<script> 
    var editor = $('#editor').data("kendoEditor"), 
     editorBody = $(editor.body); 

    // make readonly 
    editorBody.removeAttr("contenteditable").find("a").on("click.readonly", false); 

</script> 

Bitte legen nahe, wo ich falsch gehe und wie kann ich dieses Verhalten erreichen.

TIA für Ihre Hilfe!

+0

Es gibt keinen schreibgeschützten Modus für den Kendo Editor, den ich kenne, ich rende normalerweise nur den HTML-Code auf die Seite. – Padhraic

Antwort

0

folgenden Ausschnitt wird ein Kendo-HTML-Editor machen read-only:

var editor = $("#editor").data().kendoEditor; 
var editorBody = $(editor.body) 
editorBody.attr("contenteditable", false); 

oder wenn Sie das Bedürfnis fühlen terse zu sein, können Sie es wickeln alle in eine einzige Zeile:

$($("#editor").data().kendoEditor.body).attr("contenteditable", false); 

Wenn Sie den Editor zwischen lesen/schreiben und schreibgeschützt schalten müssen, würde ich empfehlen, dieses Snippet in seine eigene kleine Funktion zu wickeln und diese direkt an das click-Ereignis auf der Schaltfläche/anchor/etc zu binden Verwenden Sie, um das Verhalten umzuschalten.

Getestet wurde diese Funktionalität unter Kendo UI v2015.3.1111; YMMV auf älteren Versionen der API.