Thank you for the response. Sorry for not being more specific. It was more a general question regarding integration with Clojurescript. I meant the ReactJS Syncfusion library. Perhaps specifically the spreadsheet component. I can't find a list of props that it accepts.
By React wrapper I meant Clojurescript libraries which wrap react so that it is more convenient to use with Clojurescript.
So for the spreadsheet component I tried to supply an onChange/onchange callback but it never got called. Is it possible to control the Spreadsheet entirely through props, or is state just derived from the props that the constructor gets initially, so that after the initial mount, subsequent prop changes have no effect (as is written in the docs you linked) ?
Also: If I have some spreadsheet data present outside of the state of the Spreadsheet component, how do I edit it with the Spreadsheet component? One option would be if I could have a callback which got notified about the changes, so that I could use the information to update the spreadsheet data outside of the Spreadsheet component. Conversely, if I changed the spreadsheet data with something other than the Spreadsheet component, would passing the changed data as new props to the mounted Spreadsheet component update the component's state?
Yes, so I'm having an issue with the fact that when the Spreadsheet component is only affected by props when its constructor gets called. Subsequent changes to the "sheets" prop have no effect. Same goes for all components. If I want to change the text on a EJ button, passing in new props doesn't work.
ReactDOM.render(
<ej.spreadsheet scrollsettings-width="100%" scrollsettings-height="550" scrollsettings-isresponsive={true} sheets={sheets} loadcomplete="loadComplete" cellsave="cellSave">
</ej.spreadsheet>,
document.getElementById('spreadsheet-default')
);
|
function cellSave(args) {
alert("cellSave event triggered");
}
|
<input type="button" onclick="updateRange()" value="Update Value">
function updateRange() {
var settings = { dataSource: [{ Product: "XYZ", Price: "2000", Discount: "10" }, { Product: "XYZ", Price: "2000", Discount: "10" }, { Product: "XYZ", Price: "2000", Discount: "10" }], showHeader: "true", startCell: "J1" };
// To update range of cells with the specified settings
// Arguments - sheet index, data settings
xlObj.updateRange(1, settings);
xlObj.XLFormat.format({ "style": { "font-weight": "bold" } }, "J1:L1");
}
|