I´m using this solution in order to open modals in my React SPFx webpart, the problem is I have to open this modal from a Button in a datatable (datatables.net), since the OnClick() don't exist, only onclick() I'm having a problem calling the modal.
Is it possible put it to work?
This is the Modal link sample https://www.c-sharpcorner.com/article/modal-popup-in-spfx/
In the datatables I tried
{
data: null,
render: function (data, type, row, meta) {
return '<input type="button" class="name" id=n-"' + meta.row + '" value="Edit"/> <input type="button" class="salary" id=s-"' + meta.row + '" value="Delete"/>';
}
Then
that = this;
$('#example tbody').on('click', '.name', function () {
var data = table.row($(this).closest('tr')).data();
that.state.callchildcomponent && <MYModal myprops={that.state} handler={that.handler} />
});
But is expected working like this
public render(): React.ReactElement<ICertificatesListProps> {
return (
<div>
......
<Button onClick={(e) => this.Buttonclick(e)} variant="contained" color="primary" style={{ float: "right" }}>Add +</Button>
{this.state.callchildcomponent && <MYModal myprops={this.state} handler={this.handler} />}
Handler
handler() {
this.setState({
callchildcomponent: false
});
}
Kidnly ask the community for help
This fragment:
that.state.callchildcomponent && <MYModal myprops={that.state} handler={that.handler} />
may only work inside of the render function, as far as I understand. So you need to put in the render function, like in your "stock" example with the standard button. I would do that, and inside your button handler, would put something like this instead:
that.setState({
callchildcomponent: true
});