Scott O'connor
Scott O'connor

Reputation: 133

cant open modal from link in bootstrap modal

Very strange one.

If i take the assign link out of the dropdown, and place it anywhere on my page - it works and the modal shows. But when its in the dropdown, i click it and nothing happens...

<div class="btn-group m-b-10 btn-block">
    <button type="button" class="btn btn-warning  btn-block"><i class="far fa-check-square"></i> Tools</button>
    <button type="button" class="btn btn-warning dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        <div class="dropdown-menu" x-placement="bottom-start" style="position: absolute; transform: translate3d(82px, 36px, 0px); top: 0px; left: 0px; will-change: transform;">
            <a class="dropdown-item txt-danger" id="testbtn" style="cursor:pointer"><i class="far fa-trash-alt"></i> Delete</a>
            <div class="dropdown-divider"></div>
            <a class="dropdown-item text-danger" data-toggle="modal" data-target="#myModal" href="#"><i class="fas fa-sitemap"></i> Assign </a>
            <div class="dropdown-divider"></div>
        </div>
</div>

Upvotes: 0

Views: 90

Answers (1)

Manpreet
Manpreet

Reputation: 177

**Try this**
<br>
<div class="btn-group m-b-10 btn-block">
    <button type="button" class="btn btn-warning  btn-block"><i class="far fa-check-square"></i> Tools</button>
    <button type="button" class="btn btn-warning dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></button>
        <div class="dropdown-menu" x-placement="bottom-start" style="position: absolute; transform: translate3d(82px, 36px, 0px); top: 0px; left: 0px; will-change: transform;">
            <a class="dropdown-item txt-danger" id="testbtn" style="cursor:pointer"><i class="far fa-trash-alt"></i> Delete</a>
            <div class="dropdown-divider"></div>
            <a class="dropdown-item text-danger" data-toggle="modal" data-target="#myModal" href="#"><i class="fas fa-sitemap"></i> Assign </a>
            <div class="dropdown-divider"></div>
        </div>
</div>

Upvotes: 1

Related Questions