Hello bryntum team,
I am using froala richtext editor as a custom cell editor component, But whenever I finish editing, the new value is not getting rendered in a cell.
import React, { Component, Fragment } from "react";
import { Input, Modal } from "antd";
import ReactDOM from "react-dom";
import FroalaEditor from "react-froala-wysiwyg";
import { GlobalEvents } from "@bryntum/grid";
// Require Editor JS files.
import "froala-editor/js/froala_editor.pkgd.min.js";
// Require Editor CSS files.
import "froala-editor/css/froala_style.min.css";
import "froala-editor/css/froala_editor.pkgd.min.css";
// Require Font Awesome.
import "font-awesome/css/font-awesome.css";
export default class Richtext extends Component {
state = { value: "", modal: true };
getValue() {
return this.state.value;
}
setValue(value) {
this.setState({ value: value });
}
isValid() {
return true;
}
focus() {
this.setState((prev) => ({
...prev,
modal: true,
}));
}
onChangeHandler(value) {
console.log("onChange", value);
this.setState((prev) => ({
...prev,
value: value,
}));
}
handleOk = () => {
this.setState((prev) => ({
...prev,
modal: false,
}));
};
handleCancel = () => {
this.setState((prev) => ({
...prev,
modal: false,
}));
};
render() {
return (
<Modal
title="Details"
open={this.state.modal}
onOk={this.handleOk}
onCancel={this.handleCancel}
>
<FroalaEditor
tag="textarea"
model={this.state.value}
onModelChange={this.onChangeHandler.bind(this)}
/>
</Modal>
);
}
}
Below is the demo