asked on

How can I disable my textarea editor ?

How can I make my text area editor disabled if the user typed in more than 4000 characters?

I have tried the disable syntax but it's not working

<link type="text/css" rel="stylesheet" href="~/Content/CWScss/jodit.min.css">
<script type="text/javascript" src="~/Scripts/jodit.min.js"></script>


 jQuery(function () {
            var maxLength4000 = 4000;
            $(document).on("keyup paste blur click touchend", function () {
                var textlen = maxLength4000 - $("#AttributesAndValue").val().length;

                 //Here I want to say if textlen more than 4000 char then disable my text editor 
                //my disable is not working 

                if ($("#AttributesAndValue").text().length == 4000 || textlen <= -1) {
                    $('#AttributesAndValue').prop("disabled", true);
                }


                $('#rchars').text(textlen);
            });
            $('#AttributesAndValue').each(function () {
                var AttributesAndValue = new Jodit(this);
                AttributesAndValue.setDisabled();
            });
        });


                  <div class="form-group purple-border">
                        Attribute(s) and Value(s)
                        @Html.TextArea("AttributesAndValue", new { @class = "form-control", @style = "width:77%" })
                          <div id="ValidateAttributesAndValue" style="color:#bc0606;font-weight:bold;">Required Field</div>
                        <span id="rchars">4000</span> Character(s) Remaining
                    </div>

Open in new window

Thanks,
Lulu50

lenamtl

Hi,

why would you do that? it's not making sense, as maybe the user want to edit the text...
Or explain what exaclty the problem is...

When we limit the text area with Javascript it is only for User experience, you will need to validate the result using Server side code PHP / .NET to make sure and display a message if this is too much or not enough character before saving the info.

Javascript can be bypassed by any user using the browser console.

Scott Fell

This is something that is common to do although as mentioned, javascript can be turned off so you do want to check on the serverside for a maximum amount of characters and not rely on what is submitted. But that should go for anything.

I looked at the documentation for jodit and this does not seem to be part of the api. What you can do is load it on start through a function. Then listen for the number of characters and disable that way.

Scott Fell

I looked through the documentation again and there is ability to limit by words or characters.

https://xdsoft.net/jodit/doc/options/limitWords/
https://xdsoft.net/jodit/doc/options/limitChars/

Juan Carlos

Use: attr() insted prop()

.attr("disabled",true)

ASKER CERTIFIED SOLUTION

leakim971

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Scott Fell

I just took the time to test and it works as expected.

Here is a codepen that limits to 10 characters.

https://codepen.io/padas/pen/VwwdzKW

<div id="editor"></div>

Open in new window

var editor = new Jodit('#editor', {
    height: 200,
    limitChars: true | 10
});

Open in new window

https://xdsoft.net/jodit/doc/options/limitChars/

lulu50

ASKER

leakim971

Oh c'est fabuleux!!!

Thank you for 1,0000 and 1 times

Lulu50

lulu50

ASKER

bien joué!!!

The best answer ever

Thanks,
Lulu50

leakim971

tout le plaisir est pour moi.
you welcome