Dismiss doesn't trigger Cancel
Opened this issue · 1 comments
manodupont commented
So this is my PrintModal component using react-bootstrap-modal
/**
* PrintModal : This is a compnent that warn the user for printing. It opens a print dialog warning.
*/
import React, {PropTypes} from 'react';
import withStyles from 'isomorphic-style-loader/lib/withStyles';
import PubSub from 'pubsub-js';
import s from './PrintModal.less';
import Modal from 'react-bootstrap-modal';
class PrintModal extends React.Component {
constructor(props) {
super(props);
this.state = {};
}
componentWillMount() {
this.openPrintModalNotifier = PubSub.subscribe('print.openPrintModal', (topic, time) => {
console.log("printing modal open");
this.setState({modalIsOpen: true});
});
}
componentWillUnmount() {
PubSub.unsubscribe(this.openPrintModalNotifier);
}
render() {
let closeModal = () => this.setState({modalIsOpen: false});
return (
<div>
<Modal
show={this.state.modalIsOpen}
onHide={this.closeModal}>
<Modal.Header closeButton>
<Modal.Title id='ModalHeader'>Before you print...</Modal.Title>
</Modal.Header>
<Modal.Body>
Terms and conditions
<p>Please respect copyright, the artists and composers and all the individuals who work hard to bring you
this
music.</p>
<p>Every title on our website is legally authorized by the songwriter and licensed from them (or their
publisher).</p>
<p>Songwriters earn their living from the revenue generated from each sale. All works are protected by
copyright
law and it is unlawful to photocopy or distribute this work either physically or electronically without
consent so please do not do so.</p>
<p>You are only entitled to print the number of copies you have purchased and by pressing "Print" you agree
to
our full terms and conditions.</p>
<p><strong>Printing tips</strong></p>
<ol>
<li>Carefully check your browser print settings, making sure to switch off <strong>headers and
footers</strong> and set <strong>margins to zero</strong>.
</li>
<li>Make sure your printer is plugged in and switched on, and is well stocked with ink and paper. This
score
has <strong>{this.props.numberOfPage} page(s).</strong></li>
</ol>
</Modal.Body>
<Modal.Footer>
{/* If you don't have anything fancy to do you can use
the convenient `Dismiss` component, it will
trigger `onHide` when clicked
*/}
<Modal.Dismiss className='btn btn-default'>Cancel</Modal.Dismiss>
</Modal.Footer>
</Modal>
</div>
);
}
}
export default withStyles(s)(PrintModal);
When I hit, Cancel, nothing is dismissed. Either the Close (X) button is not working.
fawcilize commented
onHide={this.closeModal}
should be onHide={closeModal}