It would be nice to create a trail of modal box dialogs. Therefore "

should be possible now after this commit: <a class="commit-link" dat

Hi , this is the way you should implement it: <div class="highlight highlight-text

Mutiple modal dialog boxes about uikit HOT 5 CLOSED

uikit commented on June 19, 2024

Mutiple modal dialog boxes

from uikit.

Comments (5)

aheinze commented on June 19, 2024

should be possible now after this commit:

3cb1bad

from uikit.

unixversal commented on June 19, 2024

Works. The only thing that still does not work properly is to close the 2nd modal box. I can only exit the trail by adding a regular href link

<div>
    <h2>Multiple Modal</h2>
    <button class="uk-button" data-uk-modal="{target:'#modal1'}">Open Modal 1</button>

</div>

<!-- This is the modal 1-->
<div id="modal1" class="uk-modal">
    <div class="uk-modal-dialog">
        <h2>Modal 1</h2>
        <button class="uk-button uk-modal-close" data-uk-modal="{target:'#modal2'}">Open Modal 2</button>       
    </div>
</div>


<!-- This is the modal 2-->
<div id="modal2" class="uk-modal">
    <div class="uk-modal-dialog">
        <h2>Modal 2</h2>
        <a href="?cancel">Close Modal 2</a>
    </div>
</div>

from uikit.

aheinze commented on June 19, 2024

Hi , this is the way you should implement it:

<div>
    <h2>Multiple Modal</h2>
    <button class="uk-button" data-uk-modal="{target:'#modal1'}">Open Modal 1</button>

</div>

<!-- This is the modal 1-->
<div id="modal1" class="uk-modal">
    <div class="uk-modal-dialog">
        <h2>Modal 1</h2>
        <button class="uk-button" data-uk-modal="{target:'#modal2'}">Open Modal 2</button>      
    </div>
</div>


<!-- This is the modal 2-->
<div id="modal2" class="uk-modal">
    <div class="uk-modal-dialog">
        <h2>Modal 2</h2>
        <a class="uk-modal-close" href="#">Close Modal 2</a>
    </div>
</div>

from uikit.

unixversal commented on June 19, 2024

Thanks for catching up. Modified + copied your code 1 to 1 but cannot exit on 2nd Modal "Close Button".
The box remains open and adds # to the url > test.html#

Any other suggestions?

from uikit.

unixversal commented on June 19, 2024

My bad. Must have included the old modal function in the test file. Seems to work fine now. Thanks again!

from uikit.

Recommend Projects