example doesn't work.

[pgee70]

your example code doesn't link to bootstrap css.
the standard bootstrap modal styling has a default for display:none; which needs to be overwritten using:

.modal{ display:block; }

The button doesnt have a click handler
and the state.open isn't set in render it should be instantiated before that
it there is a warning if rendering to the document.body - it is preferred to render to tag, eg

import React from 'react';
import {render} from 'react-dom';
import "../../styling/main.scss";
var Modal = require('react-bootstrap-modal');
 
class App extends React.Component {
	constructor(props)
	{
		super(props);
		this.state={open:false};
		this.handleClick = this.handleClick.bind(this);
	}
 	handleClick()
 	{
 		this.setState({open:true});
 	}
 	render(){
    let closeModal = () => this.setState({ open: false })
 
    let saveAndClose = () => {
      api.saveData()
        .then(() => this.setState({ open: false }))
    }
 
    return (
      <div>
        <button type='button' onClick={this.handleClick}>Launch modal</button>
 
        <Modal
          show={this.state.open}
          onHide={closeModal}
          aria-labelledby="ModalHeader"
        >
          <Modal.Header closeButton>
            <Modal.Title id='ModalHeader'>A Title Goes here</Modal.Title>
          </Modal.Header>
          <Modal.Body>
            <p>Some Content here</p>
          </Modal.Body>
          <Modal.Footer>
            <Modal.Dismiss className='btn btn-default'>Cancel</Modal.Dismiss>
 
            <button className='btn btn-primary' onClick={saveAndClose}>
              Save
            </button>
          </Modal.Footer>
        </Modal>
      </div>
    )
  }
}


render(<App />, document.getElementById('app'));

[jquense]

I'm sorry not sure what you mean the examples work fine for me

[pgee70]

I can tell you i took an hour to get your code working from scratch - reporting these errors are to help your repo work better for others without giving up.

you don't have a link to bootstrap.
show= this.state.open literally gives an error reporting that it is not instantiated, because it isn't, that is why it should be set before the render method is called - the constructor seems like a good spot.

[jquense]

again, which examples? because these: https://github.com/jquense/react-bootstrap-modal/tree/master/docs/examples are all working for me

[pgee70]

go to
https://github.com/jquense/react-bootstrap-modal

look for Use

[jquense]

ah ok, yeah, sorry about that. the Readme code is just thrown together to illustrate the Modal component API not to be a working example. please feel free to PR a fix toake the example copy and pasteable

[Shirikatsu]

@pgee70 I am facing the same issues. Would you mind providing a fully working example of your solution?

[TheMaverickProgrammer]

this module isn't working either. I tried @pgee70 's suggested edits and the modal does not show

[aeciolevy]

I was facing the same problem...
It happened because I installed the latest version of bootstrap, I had to back with the version 3.3.7.

[brianzhou13]

Is there any movement on this issue?

I had to revert back to 3.3.7 to get this to work, but I love cards.

[jquense]

It doesn't support bootstrap v4, not likely to change in the near future

[jquense]

I do happily accept PRs :)

[smartworld-dm]

How can I use this Modal on Bootstrap V4?

I found solution later - react-bootstrap4-modal.
It was best solution for me.