Wysihtml5 Editor - Limit Anzahl der Zeichen

Question

Ich habe dies:

<div class="row"> 
    <div class="col-md-11"> 
     <label for="" class="control-label">Description<span>*</span></label> 
     @Html.TextAreaFor(m => m.Description, new { @class = "editor", @maxlength = "500" })<br /> 
     @Html.ValidationMessageFor(model => model.Description) 
    </div> 
</div> 

und die js für den wysihtml5 Editor (mit Razor Motor):

<script type="text/javascript"> 
    $('.editor').wysihtml5({ 
     stylesheets: "/Content/css/wysiwyg-color.css", 
     charset: "utf-8" 
    }) 
</script> 

Also im Grunde, was ich versuche zu tun ist die Anzahl der Zeichen (500 Zeichen max) in diesem Feld zu begrenzen. Wie Sie sehen können, habe ich das maxlength Attribut in der @Html.TextAreaFor gesetzt, aber es hat nicht funktioniert.

Kann mir bitte jemand zeigen, wie man das macht? Danke im Voraus.

Answer 1

Verwenden Sie eine ID für Ihren Textbereich, eine Klasse.
Wysihtml5 verwendet diese ID, um einen iframe zu erstellen.

Die ID für den Iframe ist "[your textarea id]-sandbox".
Da dieses Element dynamisch erstellt wird, habe ich den Code unter aktualisiert (Dies ist eine bearbeitete Antwort).

$(document).ready(function{ 
    var PreventSubmitFlag=false; 

    $('#editor').sibling("#editor-sandbox").find("body").on("keyup", function(e){ 
     var content = $(this).html(); 
     if(content.length>500){ 
      alert ("500 characters is the limit!"); 
      PreventSubmitFlag=true; 
     }else{ 
      PreventSubmitFlag=false; 
     } 
    }); 
}); 

Verwenden Sie PreventSubmitFlag, um eine Senden-Schaltfläche zu deaktivieren. ;)