Rendering a services in a ReactJS component

Question

I'm trying to rendering an external service in an ReactJS component. I'm working in an OWA for OpenMRS.

This is the React app, this is a component. When I push in some button this should render the next form in the same that component.

As you can see in the URL, the form is not an HTML page, also an service. In some post I read for render html files, this not the case. How can I work with that in my component?

Answer 1

I read the docs and found an OpenMRS feature that allows render any OpenMRS page in some panel.

This is the code and pic for I wanted to do

...
...
import OpenMRSView from './openmrsView';
...
...
renderForm(url_report) {
    let url = `http://${this.state.server}/` + url_report
    console.log(url);
    this.setState({"url": url});
}

render() {
    ....
    ....
    ....
    if(this.state.seguro=="reportes"){
        return(
            <div>
                <Button id="button_reportes" className="menu_button" style={ styles.button } onClick={() => this.renderForm(JASPER_REG_RAPIDO_ADMISIONES)}>
                Reporte Registro Rapido
                </Button>
                <Button id="button_reportes" className="menu_button" style={ styles.button } onClick={() => this.renderForm(JASPER_ROTULO_ADMISIONES)}>
                Reporte Rotulo
                </Button>
                <Button id="button_reportes" className="menu_button" style={ styles.button } onClick={() => this.renderForm(JASPER_GARANTIA_ADMISIONES)}>
                Reporte Garantia
                </Button>
                <Button id="button_reportes" className="menu_button" style={ styles.button } onClick={() => this.renderForm(JASPER_HOJA_INGRESO_ADMISIONES)}>
                Reporte Hoja de Ingreso
                </Button>
                <Button id="button_reportes" className="menu_button" style={ styles.button } onClick={this.aInicio}>
                Atras
                </Button>
                <Panel bsStyle="info" theme="chemical">
                    <Panel.Body>
                        <OpenMRSView url={this.state.url}/>
                    </Panel.Body>
                </Panel>
            </div>
        )
    }

}