Page 1 of 1

How to Rerendering the report when data source change in React Project?

Posted: Mon Dec 16, 2019 6:01 am
by amamam
Hi,
I want to fetch data in React Component and then regData for report.
in first regData it work but when change the source, report data dose not refresh.
How to rerender the report after change in dataSource?

I use this code after any change on sRequest that is my source :

Code: Select all

 
       const { sRequests } = this.props;
        var dsSRC = new window.Stimulsoft.System.Data.DataSet();
        dsSRC.readJson(sRequests);
        this.report.regData("SRC", null, dsSRC);
        

Re: How to Rerendering the report when data source change in React Project?

Posted: Tue Dec 17, 2019 2:53 pm
by HighAley
Hello.

Please, send us a sample by email with a link to this topic.

Thank you.

Re: How to Rerendering the report when data source change in React Project?

Posted: Wed Dec 18, 2019 5:05 am
by amamam
HighAley wrote: Tue Dec 17, 2019 2:53 pm Hello.

Please, send us a sample by email with a link to this topic.

Thank you.
Hello,
Please check this code that resolve the problem but i know that is not a proper way.
after that if the problem not found, i try to prepare sample.
Thank you.

Code: Select all

import React from 'react';
import { getSoftRequests } from '../../../actions/softRequests/softReqActions';
import { connect } from 'react-redux';
import PleaseWait from '../../Utils/PleaseWait'
import Alert from '../../../components/CustomComponent/MySnackbarContent'
import { MESSAGE_TYPE } from '../../../constants/modalType'
import SoftRequestFilters from '../SoftRequestFilter'
import getVisibleSoftRequests from '../../../selectors/softRequestSel'


class SoftRequestsRPT1 extends React.Component {
    constructor(props) {
        super(props);
    }
    //Actually i want to have a correct  version of this function
    setData = () => {
        let vC = document.getElementById("viewerContent")
        if (vC) {
            vC.innerHTML = "";
            this.report = new window.Stimulsoft.Report.StiReport()
            this.report.loadFile("reports/RequestRPT1.mrt");

            const { sRequests } = this.props;
            var dsSRC = new window.Stimulsoft.System.Data.DataSet();
            dsSRC.readJson(sRequests);

            this.report.regData("SRC", null, dsSRC);

            var options = new window.Stimulsoft.Viewer.StiViewerOptions();
            this.viewer = new window.Stimulsoft.Viewer.StiViewer(options, "StiViewer", false);
            this.viewer.report = this.report;

            this.viewer.renderHtml("viewerContent");
        }
    }

    componentDidMount() {
        this.props.getSoftRequests();//load data
    }

    render() {
        const { loading, error, message } = this.props;

        if (!error)
            return (
                <div>
                    <SoftRequestFilters />{/* Filter Component with button to refresh the loaded data,at here named 'sRequests' */}
                    <br />
                    {loading ? <PleaseWait /> : <div id="viewerContent"></div>}
                </div>
            )
        //error in load data
        else if (message && message.messageType && (message.messageType === MESSAGE_TYPE.SOFTREQUEST_FAILED)) {
            return (<Alert className=" mr-3" variant={'error'} message={error} />)
        }
        else {
            return <h1></h1>
        }
    }
    componentDidUpdate(prevProps) {
        //check if new data from user requested
        if (prevProps.loading === true && this.props.loading === false)
            this.setData()
    }
}
export default connect(
    state =>
        ({
            loading: state.softReq.loading,
            sRequests: getVisibleSoftRequests(state.softReq.items, state.softRequestStatus),
            error: state.softReq.error,
            message: state.messages,
        })
    ,
    dispatch =>
        ({
            getSoftRequests() {
                dispatch(getSoftRequests())
            }
        })
)(SoftRequestsRPT1)

Re: How to Rerendering the report when data source change in React Project?

Posted: Tue Dec 24, 2019 11:29 am
by Lech Kulikowski
Hello,

Thank you fort he provided code.

Thank you.