locked
Cannot enable Tinymce editor after page load RRS feed

  • Question

  • User657329123 posted

    Hi there,

    In my MVC app, I have I'm using an editor template where I have initialized the Tinymce editor like this

        (function(){
    
                tinymce.init({
                selector: 'textarea',
                theme: 'modern',
                mobile: { theme: 'mobile' },
                menubar: 'edit insert format table tools help',
                plugins: 'print preview fullpage paste searchreplace autolink directionality visualblocks visualchars fullscreen link table charmap hr toc advlist lists textcolor wordcount imagetools contextmenu colorpicker textpattern help',
                toolbar1: 'formatselect | bold underline italic strikethrough forecolor backcolor | link unlink | alignleft aligncenter alignright alignjustify  | numlist bullist outdent indent  | removeformat',
                image_advtab: true,
                browser_spellcheck: true,
                branding: false,
                readonly:true
          });
    
        })();

    So when the page loads , contentarea, menubar and toolbar are readonly just like I want. I have three textareas in a view and three checkboxes. When I manually toggle the checkbox, I can toggle the readonly state of Tinymce without any problem.

    When my Edit view loads, say chkbox1 is checked and but Tinymce in related textarea is displayed in readonly state. On page load, I would like make the textarea and Tinymce editor active if the related checkbox is checked.  I'm not able to accomplish this. There are no JavaScript errors.

    Here is my jQuery code,

        $(document).ready(function () {
            if ($('#chkBox1').prop('checked')) {
                $("#textarea1").rules("add", "required");
                tinymce.get('textarea1').setMode('design');
            }
            else {
                tinymce.get('textarea1').setMode('readonly');
                tinymce.get('textarea1').setContent('');
                $("#textarea1").rules("remove", "required");
                $("#textarea1-error").hide();
            }
          });
    

    I hope someone here has used Tinymce and shed some light.

    Thanks

    Joe

    Thursday, May 17, 2018 5:00 PM

All replies

  • User-210127581 posted

    I recently built a CMS from the ground up (Not ASP.Net) and am very familiar with TinyMCE and other editors for that matter. Do you have a project file? My guess is the issue is with asp.net and not TinyMCE. Why do you think the issue is with TinyMCE?

    Thursday, May 17, 2018 5:26 PM
  • User657329123 posted

    It is an MVC project. What do you mean by project file? I don't know what the issue is and whether it is with Tinymce or asp.net.  I'm just trying to figure out how to make the editor active.  One thing I have noticed is that I'm not able to set the mode of Tinymce programatically. When I manually toggle the checkbox, the line below works

    tinymce.get('textarea1').setMode('design');

    but not if I set it on Page Load.

    Thursday, May 17, 2018 5:39 PM
  • User1724605321 posted

    Hi joegreen ,

    What is your version of Tinymce ? And please try to move checkbox validation login into callback to tinyMCE.init :

    https://stackoverflow.com/questions/6287350/how-to-tell-if-tinymce-has-been-initated 

    Best Regards,

    Nan Yu

    Tuesday, May 22, 2018 9:50 AM