Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: Modal doesn’t work after upgrading to pro

Bhagya pro asked 6 years ago


I recently upgraded to pro mdbreact version, but everything works fine except the Modal component. It was working fine in the Free version.

Following warnings are in the browser console.

index.js:2178 Warning: Unknown event handler property `onExited`. It will be ignored.
in div (created by t)
in t
in div (created by t)
in t
__stack_frame_overlay_proxy_console__ @ index.js:2178
index.js:2178 Warning: Received `true` for a non-boolean attribute `in`.

If you want to write it to the DOM, pass a string instead: in="true" or in={value.toString()}.
in div (created by t)
in t
in div (created by t)
in t

Here is my ModalPage,

import React from 'react';
import { Container, Button, Modal, ModalBody, ModalHeader, ModalFooter } from 'mdbreact';


class ModalPage extends React.Component {
constructor(props) {
super(props);
this.state = {
modal: false
};

this.toggle = this.toggle.bind(this);
}

toggle() {
this.setState({
modal: !this.state.modal
});
}

render() {
return (
<Container>
<Button color="danger" onClick={this.toggle}>Modal</Button>
<Modal isOpen={this.state.modal} toggle={this.toggle}>
<ModalHeader toggle={this.toggle}>Modal title</ModalHeader>
<ModalBody>
(...)
</ModalBody>
<ModalFooter>
<Button color="secondary" onClick={this.toggle}>Close</Button>{' '}
<Button color="primary">Save changes</Button>
</ModalFooter>
</Modal>
</Container>
);
}
}

export default ModalPage;

Here is App.js

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import ModalPage from './ModalPage'

class App extends Component {
render() {
return (
<div className="App">
<ModalPage/>
</div>
);
}
}

export default App;

I can send source files for your reference.


 


roshanpr pro answered 6 years ago


Hi, The temporary fix of adding #dev doesnt seem to work. Still getting the same error.

Mikołaj Smoleński staff commented 6 years ago

Most probably You didn't reinstall package properly. You should delete mdbreact from dependencies, then type 'yarn', next add mdbreact with #dev and finally type yarn again to install it. Best Regards

Mikołaj Smoleński staff answered 6 years ago


Hi there, To temporary fix that issue please download our package from 'dev' branch, like this: "dependencies": { "mdbreact": "git+https://oauth2:YOUR_TOKEN@git.mdbootstrap.com/mdb/react/re-pro.git#dev" } Appologies for this problem. It will be fixed on master branch also, but with the next release. Best Regards

michaelxin pro answered 6 years ago


I have similar issue... very big problem .

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB React
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: Yes
  • Provided link: No
Tags