केंडो यूआई संपादक अधिकतम और न्यूनतम वर्ण

Question

मैं केंडो यूआई संपादक के लिए एमवीसी एक्सटेंशन का उपयोग कर रहा हूं। क्या एचटीएमएल सामग्री को छोड़कर न्यूनतम और अधिकतम संख्या में वर्ण सेट करने का कोई विकल्प है।

मैंने स्ट्रिंग लम्बाई विशेषता का उपयोग किया लेकिन इसमें HTML सामग्री शामिल है।

Answer 1

आप केंडो संपादक के बारे में सही हैं कि ये विकल्प न हों। कुछ जावास्क्रिप्ट और jQuery के साथ ऐसा करना संभव है। यह उदाहरण केंडो कोर का उपयोग कर रहा है (जो एएसपी.नेट एमवीसी जैसे केंडो रैपर को अभी भी एएसपी.नेट एमवीसी में काम करना चाहिए, आप $ ("# editor") को कॉल नहीं करते हैं। जावास्क्रिप्ट में 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> 

सीएसएस:

.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); 
});