CODEWITHSUNDEEP
javascriptreactjsdrop-down-menureact-bootstrapdropdownbutton
programmaticthinkingJay
programmaticthinkingJay

Reputation: 21

How to manually close react-bootstrap "DropdownButton" in React.js

In react-bootstrap the DropdownButton is suppose to be the short version for Dropdown applied with a Dropdown.Menu and Dropdown.Items but the problem im having is i can't figure out how to to manually open/close the dropdown. It automatically closes when clicked anywhere outside of the box but i have a submit button inside of my labelsArrayContainer that i want to close the dropdown once its clicked. Below is my code.

<OverlayTrigger placement="bottom" overlay={labelTooltip} delayShow={Constants.TOOLTIP_DELAY}>
      <span>
          <DropdownButton 
              bsStyle='secondary' 
              bsSize='small' 
              onClick={this.handleResetInput} 
              className="e-caret-hide" 
              title={<i className="fa fa-tag"/>} 
              id='label-dropdown-button'
           >
               {labelsArrayContainer}
          </DropdownButton>
       </span>
</OverlayTrigger>

Upvotes: 1

Views: 502

Answers (1)

programmaticthinkingJay
programmaticthinkingJay

Reputation: 21

i found an answer. The DropdownButton has an open property that's a boolean value that's not in the documentation. This can be used to manually toggle the "DropdownButton"

Upvotes: 1

Related Questions