Dropdown & Modal components

Bonjour impossible d'ouvrir le modal, le nom des ID sont correctes, cela fonctionne de cette façon :

Code:

1
2
3
4
5
<li class="nav-item">
<a href="#account" class="nav-link" data-toggle="modal" data-target="#account">Mon Compte</a>
<div class="modal fade" id="account" tabindex="-1" aria-hidden="true">
...
 </li>

avec le dropdown sa ne fonctionne pas

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<li class="nav-item dropdown">
    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        Menu ( <img src="assets/images/nav/user.svg" alt="" /> )</a>
    <div class="dropdown-menu" aria-labelledby="navbarDropdown">
        <a href="#account" class="dropdown-item" data-toggle="modal" data-target="#account">
            Mon Compte ( <img src="assets/images/nav/account.svg" alt="" /> )</a>
        <div class="modal fade" id="account" tabindex="-1" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header d-flex align-items-end">
                        <h6 class="modal-title text-muted">Notifications</h6>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                    </div>
                    <div class="modal-body">
                        ...
                    </div>
                </div>
            </div>
        </div>
        <div class='dropdown-divider'></div>
        <a href="logout.php" class="dropdown-item">Disconnect</a>
    </div>
</li>

Merci

Bonjour,

Citation:

Bonjour impossible d'ouvrir le modal,

sans le contexte d'utilisation difficile de t'en dire plus !

bonjour NoSmoking

j'ai retirer le modal du '<div class="dropdown-menu" ...', ça a l'air de fonctionner
Code:

1 2 3 4 5 6 7 <div class="dropdown-menu" aria-labelledby="navbarDropdown"> ... </div> <div class="modal fade" id="account" tabindex="-1" aria-hidden="true"> ... </div>
bizarre qu'il n'est pas possible d'inséré un Modal dans une class "dropdown-menu".

Citation:

bizarre qu'il n'est pas possible d'inséré un Modal dans une class "dropdown-menu".

pourquoi, la finalité, et le rôle, de chacun est somme toute bien différente !