Nesting Modal Windows

User 2796380 Photo


Registered User
94 posts

When nesting modal windows you have window 1 open and click on button for modal 2. What I don't know how to do is when you click "close" on window 2 to not close window 1, just close window 2 and default back to window 1.

When you click on modal 2 open button does it cause modal 1 to auto close then open modal 2? If that is so how do you reopen modal 1 when closing modal 2?

Reason need to do this is: I have several nested buttons in window 1. The way it is now have to go back to Start then open window 1 back up to click on modal window 3, then again for window 4.

Does anyone know how to do this?
Larry Penny
User 2699991 Photo


Registered User
4,797 posts
Online Now

Can't do that as far as I know, by opening modal 2 it automatically closes modal1

What you really need to do is have a button which says something like "back" or "Previous" somewhere on the modal2 window,, then set the trigger for that button to open the modal 1 window (modal1 ID)

Or you could use something like < > arrows a bit like having a slide show really
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 2699991 Photo


Registered User
4,797 posts
Online Now

EZorb wrote:
When nesting modal windows you have window 1 open and click on button for modal 2. What I don't know how to do is when you click "close" on window 2 to not close window 1, just close window 2 and default back to window 1.

When you click on modal 2 open button does it cause modal 1 to auto close then open modal 2? If that is so how do you reopen modal 1 when closing modal 2?

Reason need to do this is: I have several nested buttons in window 1. The way it is now have to go back to Start then open window 1 back up to click on modal window 3, then again for window 4.

Does anyone know how to do this?


Got a video showing how to do this if it will be of use for you
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 2699991 Photo


Registered User
4,797 posts
Online Now

EZorb wrote:
When nesting modal windows you have window 1 open and click on button for modal 2. What I don't know how to do is when you click "close" on window 2 to not close window 1, just close window 2 and default back to window 1.

When you click on modal 2 open button does it cause modal 1 to auto close then open modal 2? If that is so how do you reopen modal 1 when closing modal 2?

Reason need to do this is: I have several nested buttons in window 1. The way it is now have to go back to Start then open window 1 back up to click on modal window 3, then again for window 4.

Does anyone know how to do this?


The modal windows have to be on the same site page of course
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 2796380 Photo


Registered User
94 posts

Hi Wayan,

Shoot me the video. Have all modal windows finished and need to address the close problem. I would assume the fix you would add to all the nested windows.
Larry Penny
User 2796380 Photo


Registered User
94 posts

Wayan Jaya wrote:
Can't do that as far as I know, by opening modal 2 it automatically closes modal1

What you really need to do is have a button which says something like "back" or "Previous" somewhere on the modal2 window,, then set the trigger for that button to open the modal 1 window (modal1 ID)

Or you could use something like < > arrows a bit like having a slide show really


I would assume you would replace the "Close button" with some back or return to Window #1 button

I gave up on loading from external source must be above everyone pay grade. Reason couldn't get it to work on Ajax is Zurb removed Ajax in ver 6.3. But they said it was easy to add back in. If you knew where and how. Scott said he would put in a ticket but would be awhile. So that leaves me with about 6 - 8 pdf files that won't work correctly.
Larry Penny
User 187934 Photo


Senior Advisor
20,187 posts

Here's a boostrap version.
http://jsfiddle.net/CxdUQ/
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2796380 Photo


Registered User
94 posts

Eric Rohloff wrote:
Here's a boostrap version.
http://jsfiddle.net/CxdUQ/


That's it. Can you tell if this is all that needs to be added or changed.
data-dismiss="modal" aria-hidden="true" I see also "primary"
Larry Penny
User 187934 Photo


Senior Advisor
20,187 posts

Give it a try. It looks fairly simple. The JQuery is the important stuff
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 244626 Photo


Registered User
811 posts

Here is the Foundation version

https://jsfiddle.net/noxquws1/22/

Important to add data-multiple-opened attribute="true" to second modal which should be nested.

Bootstrap 5 CSS Grid.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.