Open lxtadhamnawito opened 2 years ago
It is the correct behavior. Editor in the read-only mode does not allow saving, and throws an error when you programmatically tries to save it.
@neSpecc So what should I do to allow it save data, and at the same time allow read-only for the Editor itself (as I toggle it when the editor is OnEdit mode read-only = false). Or what I'm saying above is not doable at all?
I can't understand what you want to achieve. Editor in read-only just shows passed data. You can't change it. So what do you want to save if you already have data that you pass to the editor?
@neSpecc I want to save the data if the user edit it. As I can press edit button for example which sets Editor's "readOnly=false" so it become editable and add some headers and paragraphs then press save.
So I have 2 cases: 1- readOnly = true --> where I display the data only that I have. 2- readOnly = false --> (on pressing edit) where some data are added/deleted and save them back again.
I had the same need, I forked the library and did a modification to the next file: src/components/modules/api/saver.ts
import { Saver } from '../../../../types/api';
import { OutputData } from '../../../../types';
import * as _ from '../../utils';
import Module from '../../__module';
/**
* @class SaverAPI
* provides with methods to save data
*/
export default class SaverAPI extends Module {
/**
* Available methods
*
* @returns {Saver}
*/
public get methods(): Saver {
return {
save: (force=false): Promise<OutputData> => this.save(force),
};
}
/**
* Return Editor's data
*
* @returns {OutputData}
*/
public save(force=false): Promise<OutputData> {
const errorText = `Editor\'s content can not be saved in read-only mode -> ${force}`;
if (force == false && this.Editor.ReadOnly.isEnabled) {
_.logLabeled(errorText, 'warn');
return Promise.reject(new Error(errorText));
}
return this.Editor.Saver.save();
}
}
I basically added a (force=false) to the getter method so you can do:
this.editor.save(true) // For forcing the saving even in readonly mode
//Or
this.editor.save() // To keep current validation
You can control boolean value of readOnly. Pass props for it
Chiming in: I also need to be able to save while in read-only mode: basically for the purposes of programmatically converting HTML from another source into editor blocks JSON for various purposes. renderFromHTML()
also errors in read-only mode.
I'm using EditorJS as my rich text editor, but I'm using readOnly option, as I don't want the user to edit what is written unless he press on a specific button. So whenever the user start to edit it and try to save it, I got this
Error: Editor's content can not be saved in read-only mode
read-only option is mentioned in the documentation here, but it doesn't mention how to use it ! So Am I using read-only wrongly, or it should be set in other way? If yes, how to enable read-only mode for tools.
This is what I'm using:
Browser: Chrome. OS: Windows 10.
Editor.js version: Latest version.
Plugins: "react-editor-js"