Topic: Close bug in long dropdown inside modal

hockchuan free asked 7 years ago


I am using some dropdowns in the modal. If the dropdown list contains many items that causes the scrollbar to appear and then I use mouse on the scrollbar, the list will simply close. But it doesn't exhibit the close issue if I use mouse wheel instead.

            <button type="button" class="btn btn-primary waves-effect waves-light" data-toggle="modal" data-target="#centralModalInfo">Central Modal</button>
            <div class="modal fade" id="centralModalInfo" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                <div class="modal-dialog modal-notify modal-info" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <p class="heading lead">Modal Info</p>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true" class="white-text">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body">
                            <select class="mdb-select">
                                <option value="" disabled selected>Choose your option</option>
                                <option value="1">Option 1</option>
                                <option value="2">Option 2</option>
                                <option value="3">Option 3</option>
                                <option value="4">Option 4</option>
                                -- Truncated for brevity
                            </select>
                            <label>Example label</label>
                        </div>
                    </div>
                </div>
            </div>

Rothert pro answered 6 years ago


Hello, Seems that this issue is  still unsolved, because I'm facing the same problem with MDB pro V4.5.2 Unfortunately, removing the tabindex="-1" on the Modal, does not fix the issue in my case. This only happens when a scrollbar appears in the drop-down list Any idea? Thanks a lot Best regards Peter

hockchuan free answered 7 years ago


Thanks, tblfounder. The removal of tabindex="1" fixed my issue.

tblfounder pro answered 7 years ago


Try taking out the tabindex="-1". This worked for me...

We're working on the new version of MDB. Currently, we cannot provide you estimated time

Rothert pro commented 5 years ago

Hello, Seems that this issue is still unsolved, because I’m facing the same problem with MDB pro V4.5.7 Unfortunately, removing the tabindex=”-1″ on the Modal, does not fix the issue in my case. This only happens when a scrollbar appears in the drop-down list Any idea? Thanks a lot Best regards Peter

hockchuan free answered 7 years ago


What's the timeline for the fix? Thanks.

Edyta Dabrowska free answered 7 years ago


Hello, Thank you for noticing this. We will try to fix this in the future. Regards,

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: Free
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags