MDBDropdown doesn't render when contained in MDBStepper


Topic: MDBDropdown doesn't render when contained in MDBStepper

Jean-Philippe Steinmetz pro premium priority asked 9 months ago

Expected behavior

A MDBDropdown contained inside a MDBStepperContent tag should render correctly.

Actual behavior

The MDBDropdown component doesn't render.

Resources (screenshots, code snippets etc.)

<MDBStepper>
    <MDBStepperForm linear>
            <MDBStepperStep itemId={1}>
                <MDBDropdown>
                    <MDBDropdownMenu>
                        <MDBDropdownItem>Hello</MDBDropdownItem>
                    </MDBDropdownMenu>
                </MDBDropdown>
            </MDBStepperStep>
    </MDBStepperForm>
</MDBStepper>

Krzysztof Wilk staff commented 9 months ago

I think there's a problem with a Dropdown component. We'll try to fix this issue before the next release :)


Wojciech Staniszewski staff answered 9 months ago

You are not using the MDBDropdown component corecct. The code should be like this:

<MDBStepperContent>
    <MDBDropdown>
      <MDBDropdownToggle>Dropdown button</MDBDropdownToggle>
      <MDBDropdownMenu>
        <MDBDropdownItem>
          <MDBDropdownLink href='#'>Action</MDBDropdownLink>
        </MDBDropdownItem>
        <MDBDropdownItem>
          <MDBDropdownLink href='#'>Another action</MDBDropdownLink>
        </MDBDropdownItem>
        <MDBDropdownItem>
          <MDBDropdownLink href='#'>Something else here</MDBDropdownLink>
        </MDBDropdownItem>
      </MDBDropdownMenu>
    </MDBDropdown>
  </MDBStepperContent>

However, there was a problem with the position of the dropdown menu. The fix will be available in this release.


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: Yes
  • Technology: MDB React
  • MDB Version: MDB5 1.3.0
  • Device: All
  • Browser: All
  • OS: All
  • Provided sample code: No
  • Provided link: No