Want only 1 instance of modal popup triggered by multiple buttons

[calebja]

Hi,

I want only 1 instance of a modal popup triggered by multiple buttons.

I’m using a modal as a button, and triggering a popup that displays a form. My issues is that I have to duplicate the Modal several times on the page, so this means that the form being used (a gravity form) is also duplicated. Gravity forms doesn’t allow for several instances of the form on a single page, only 1. Therefore, what I would like is for a button to trigger a single modal popup instead of having to duplicate the the popup several times on the page. Please assist!

[tristup]

Hi @calebja,

Thanks for reaching out.
I would suggest you add the same class named open-modal-button to all the Buttons and then follow the instruction given in the following thread to achieve what you are trying.

Make button trigger modal, but only upon click (not at pageload)

Hi @nblund, You can use the following code to trigger the modal on the button click. Here open-modal-button is the class assigned to the button and the assigned id of the modal my-content-area-1. Remember that, the anchor-toggle suffix will be added to the given id of Modal. [Screenshot-2021-12-17-183402] [Screenshot-2021-12-17-183420] jQuery ( document ).on ('click', '.open-modal-button', ( e ) => { e.preventDefault(); jQuery('#my-content-area-1-anchor-toggle')[0].click(); } )…

Hope it helps.
Thanks