Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Dialog] onRequestClose seems not to be fired - what I am doing wrong ? #2385

Closed
TimoRuetten opened this issue Dec 6, 2015 · 3 comments
Closed
Labels
component: dialog This is the name of the generic UI component, not the React module!

Comments

@TimoRuetten
Copy link

I am testing around with ReactJS and using Material-Ui. For a small Test Component I am using Dialog. I am using like the same code as in your example but this seems not to work. Maybe there is a bug or the docs were not clear enough for me.

Here is the Code

const {Dialog, FlatButton} = MUI;

Home = React.createClass({
  getInitialState() {
    return {
      welcomeModal: false
    };
  },
  openWelcomeDialog() {
    this.setState({welcomeModal:true});
  },
  closeWelcomeDialog(buttonClicked) {
    console.log('Close The Welcome Dialog.');
    this.setState({welcomeModal:false});
  },
  render() {
    let modalActions = [
      { text: 'Cancel' }
    ];
    return (
      <div>
        <h1>Welcome to my app</h1>
        <a href="#" onClick={this.openWelcomeDialog}>Open the Welcome Modal</a>
        <Dialog
          title="Welcome Modal"
          actions={modalActions}
          autoDetectWindowHeight={true}
          autoScrollBodyContent={true}
          open={this.state.welcomeModal}
          onRequestClose={this.closeWelcomeDialog}>
        <div style={{height: '1000px'}}>
          Really long content
        </div>
        </Dialog>
      </div>
    );
  }
});

What happens:

When I click on the link the event will be fired and the modal is opening in the right way. But: It does not matter on what I am clicking if in the background or on the Cancel-Button: The Modal will not be closed and also the console.log will not be fired ... so: The method will not be called! In my example its impossible to close the modal.

@oliviertassinari
Copy link
Member

First, are you calling injectTapEventPlugin()?

@TimoRuetten
Copy link
Author

Oh .. 'rly ? Now it works. I was trying to find the problem for a while now ...

So the answer is: No, I was not calling it. Did not saw this referenced in the Material-Ui Docs. Thanks @oliviertassinari !

@name-k
Copy link

name-k commented Apr 23, 2017

I have the same issue, and I'm using injectTapEventPlugin(). And everything else related to events seems to be working. Should I check for something else?

The problem is pretty much the same as in the opening topic, no matter where I click - it does not fired.

@zannager zannager added the component: dialog This is the name of the generic UI component, not the React module! label Dec 21, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: dialog This is the name of the generic UI component, not the React module!
Projects
None yet
Development

No branches or pull requests

4 participants