검도 UI 편집기 최대 자 및 최소 자

Question

나는 Kendo UI 편집기 용 MVC 확장을 사용하고 있습니다. HTML 내용을 제외한 최소 및 최대 문자 수를 설정하는 옵션이 있습니까?

StringLength 속성을 사용했지만 HTML 콘텐츠가 포함되어 있습니다.

Answer 1

이러한 옵션이없는 검도 편집자에 대한 이야기입니다. 일부 JavaScript 및 jQuery로이를 수행 할 수 있습니다. 이 예제에서는 Kendo Core (ASP.NET MVC와 같은 Kendo Wrappers는 여전히 ASP.NET MVC에서 작동해야합니다. JavaScript()에서는 kendoEditor())를 호출하지 않습니다.

여기 내 jsFiddle example입니다.

HTML :

<h3 class="text-primary">Text Only Count: <span id="textCount"></span></h3> 
<div id="example"> 
    <textarea id="editor" rows="10" cols="30" style="height:440px"> 
     <p>Kendo UI Editor allows your users to edit HTML in a familiar, user-friendly way. 
      <br />In this version, the Editor provides the core HTML editing engine, which includes basic text formatting, hyperlinks, lists, and image handling. The widget <strong>outputs identical HTML</strong> across all major browsers, follows accessibility standards and provides API for content manipulation.</p> 
     <p>Features include:</p> 
     <ul> 
      <li>Text formatting & alignment</li> 
      <li>Bulleted and numbered lists</li> 
      <li>Hyperlink and image dialogs</li> 
      <li>Cross-browser support</li> 
      <li>Identical HTML output across browsers</li> 
      <li>Gracefully degrades to a <code>textarea</code> when JavaScript is turned off</li> 
     </ul> 
    </textarea> 
</div> 

CSS :

.warning { color: red; } 

자바 스크립트 :

$(function() { 
    $("#editor").kendoEditor(); 
    var minChar = 100; 
    var maxChar = 600; 
    var iframe = $("iframe"); 

    // Change event for iframe body content 
    iframe.contents().find("body").on('keydown', function (e) { 
     //Clean up 
     $("#textCount").removeClass("warning"); 

     // Get Body (.text() strips out HTML tags) 
     var data = $(this).text(); 
     if (this.which < 32) { 
      return; // Do nothing 
     } 

     var isEditKey = (e.keyCode == 8 || e.keyCode == 46); 

     if (data.length == maxChar && !isEditKey) { 
      e.preventDefault(); 
     } else if (data.length > maxChar) { 
      // Maximum exceeded 
      $(this).text(data.substring(0, maxChar)); 
     } else if (data.length < minChar) { 
      $("#textCount").addClass("warning"); 
     } 
     $("#textCount").text(data.length); 
    }); 

    // OnLoad call to get starting count 
    var data = iframe.contents().find("body").text(); 
    $("#textCount").text(data.length); 
});