Set read-only mode

Puts or restores the editor into readonly state. When editor in read-only, the user is not able to change the editor content throught wysiwyg and throught source editor, but can still use some editor functions (fullsize, print, show source code).

<link type="text/css" rel="stylesheet" href="build/jodit.min.css" />
<script type="text/javascript" src="build/jodit.min.js"></script>
Copy

const editor = Jodit.make('#editor', {
	readonly: true
});

editor.events.on('readonly', function (isReadOnly: boolean) {
	console.log('Current state:' + isReadOnly);
});

editor.setReadOnly(false); // this method firing the `readonly` event.
editor.setReadOnly(true);
console.log(editor.getReadOnly());

// toggle read-only
editor.setReadOnly(!editor.getReadOnly());
Copy

by default in readonly state it shows all buttons, but almost all of them are disabled. Only the source,print,fullsize,about and dots buttons work. But you can set your own buttons list:

const editor = Jodit.make('#editor', {
	readonly: true,
	activeButtonsInReadOnly: ['source', 'about'] // active only two buttons
});
Copy

Result