javascript - code - wysiwyg editor free

make readonly/disable tinymce textarea

Question

Necesito desactivar o hacer solo un texto de texto de tinymce en tiempo de ejecución.

Answer 1

A partir de la versión 4.3.x puede usar el siguiente código para el modo de solo lectura

tinymce.activeEditor.setMode(''readonly'');

y para el modo de diseño:

tinymce.activeEditor.setMode(''design''); 

Answer 2

Eso funciona para ASP.NET MVC Razor

readonly: @(Model.Readonly ? "true" : "false")

al inicializar tinyMCE:

tinymce.init({/* put readonly setting here */});

Answer 3

Intento utilizar Readonly: 1 comando cuando lo uso, la barra de herramientas desaparece.

cómo usar el

tinymce.activeEditor.getBody (). setAttribute (''contenteditable'', falso);

Answer 4

La solution de Thariama establecerá todas las áreas de texto de TinyMCE en la página de solo lectura.

La mejor solución que he encontrado fue posted por Magnar Myrtveit, que configurará campos de solo lectura que tienen el atributo de solo lectura. Aquí está el código:

tinyMCE.init({
    ...
    setup: function(ed) {
        if ($(''#''+ed.id).prop(''readonly'')) {
            ed.settings.readonly = true;
        }
    }
});

Answer 5

Para deshabilitar puede llamar a este comando:

tinymce.EditorManager.execCommand(''mceToggleEditor'', true, tinymceId);

Y para habilitar de nuevo al editor, puede volver a llamar a este comando.

El comando '' mceToggleEditor '' activa o desactiva el modo WYSIWYG al mostrar u ocultar el área de texto y la instancia del editor. Esto no es lo mismo que mceAddControl o mceRemoveControl porque la instancia todavía está allí y no está inicializada, por lo que este método es más rápido.

Enlace para el comando anterior: http://archive.tinymce.com/wiki.php/TinyMCE3x:Command_identifiers

Answer 6

Puede ver esta respuesta aquí en @rioted: https://.com/a/34764607/1827960 .

Lo usé para llegar a esta solución:

tinymce.settings = $.extend(tinymce.settings, { readonly: 1 });
tinymce.EditorManager.editors.forEach(function (editor) {
    tinymce.EditorManager.execCommand(''mceRemoveEditor'', false, editor.id);
    //tinymce.EditorManager.editors = [];
    tinymce.EditorManager.execCommand(''mceAddEditor'', false, editor.id);
});

Answer 7

SI solo tienes un editor, esto funciona:

tinymce.activeEditor.getBody().setAttribute(''contenteditable'', false);

Si tiene varios editores, debe seleccionarlos mediante el id del área de texto:

tinyMCE.get(''textarea_id'').getBody().setAttribute(''contenteditable'', false);

Answer 8

Tal vez esta línea de código ayude en otros navegadores que usan iframes.

tinymce.activeEditor.getBody().contenteditable = false

¡Saludos!

Answer 9

Use el parámetro de configuración de solo lectura

tinyMCE.init({
        ...
        theme : "advanced",
        readonly : 1
});

Aquí hay un enlace a una demostración .

Actualización : lo que puede hacer para evitar que los usuarios editen contenido en su editor es establecer el atributo content-editable de los editores iframe body en false:

tinymce.activeEditor.getBody().setAttribute(''contenteditable'', false);

Answer 10

puedes usar

this.getBody().setAttribute(''contenteditable'', false);

mira la solución completa, mi lado del servidor es Asp.net MVC

 setup: function (ed) {
        ed.on(''init'', function () {
            this.execCommand("fontSize", false, "17px");
            $("html,body").scrollTop(0);
            @if (ViewBag.desableEdit != null && ViewBag.desableEdit == true)
            {
                <text>
                    this.getBody().setAttribute(''contenteditable'', false);
                </text>
            }

        });

Una forma análoga de hacerlo si tiene server side condition que se eliminará en el HTML devuelto

 tinymce.init({
    selector: ... ,
    ....
    @if (ViewBag.desableEditExseptExportNumber != null && ViewBag.desableEditExseptExportNumber == true)
    {
         <text>
              readonly: 1,
         </text>
    }
    language: ''ar'',
    ....});