Modal error - it seems in background


Topic: Modal error - it seems in background

Mazzilli pro premium priority asked 3 years ago

Hi, I am using exactly your example code to create a modal. When I click the button to open the modal, everything is darkened, including the modal, and nothing on the screen is clickable.

What am I doing wrong?

const [basicModal, setBasicModal] = useState(false);
  const toggleShow = () => setBasicModal(!basicModal);
  return (
    <>
      <MDBBtn onClick={toggleShow}>LAUNCH DEMO MODAL</MDBBtn>
      <div>TEST CONTENT</div>
      <MDBModal show={basicModal} getOpenState={(e) => setBasicModal(e)} tabIndex='-1'>
        <MDBModalDialog>
          <MDBModalContent>
            <MDBModalHeader>
              <MDBModalTitle>Il tuo premio!</MDBModalTitle>
              <MDBBtn className='btn-close' color='none' onClick={toggleShow}></MDBBtn>
            </MDBModalHeader>
            <MDBModalBody>
              <p>Ecco il premio che ti sei meritato:</p>
            </MDBModalBody>
            <MDBModalFooter>
              <MDBBtn color='secondary' onClick={toggleShow}>
                Close
              </MDBBtn>
            </MDBModalFooter>
          </MDBModalContent>
        </MDBModalDialog>
      </MDBModal>
    </>

Try downloading newer MDB version in the first place :) Modal has been changed and repaired several times.


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
  • User: Pro
  • Premium support: No
  • Technology: MDB React
  • MDB Version: MDB5 1.0.0-beta6
  • Device: PC
  • Browser: Chrome
  • OS: Win64
  • Provided sample code: No
  • Provided link: No