Skip to content

Add option to show modal on page load if hash in URL matches an id of initialized modal - #383

Open
fromaline wants to merge 3 commits into
micromodal:masterfrom
fromaline:master
Open

Add option to show modal on page load if hash in URL matches an id of initialized modal#383
fromaline wants to merge 3 commits into
micromodal:masterfrom
fromaline:master

Conversation

@fromaline

@fromaline fromaline commented Oct 23, 2020

Copy link
Copy Markdown

Thanks for the project @ghosh, @kakadiadarpan and @kalpeshsingh! It's my favorite library for modals.
But in my opinion, it's missing an important feature - being able to open the page with an opened modal.
This feature is especially useful in multipage CMS-driven websites. For example, if a backend developer needs to open the page with an already opened modal and he may not want to make it with JS directly.
I implement this option trying not to break anything. Now you could set this option to true (default is false) and add a hash that matches the id of initialized with triggers (not programmatically, of course) modal, the modal will be shown on page load.

Modal.init{
    ...,
    showModalFromURL: true
}

I've tried not to bump library size, also have fixed some issues in naming, inconsistencies in quotes usage and replaced let with const in two place, where value is not changing anytime some.
I've updated the docs accordingly and turn the feature on for the demo page in case anyone would want to try it out. (works with #modal-1)
It's my first contribution to open-source, so if I've made something wrong, sorry in advance. Oh, I accidently commit from another account, just forgot to change credentials.
Have a nice day :)

Rename targetModal to targetModalId, because it's actually an id, but initial name corresponds to DOM element, rewrite JSDoc accordingly. Replace let with const in two place, where value is not changing anywhere. Replace backticks with single quotes, where embedded expressions aren't used.
I add option for showing modal on page load if hash in url matches id of the modal, that was initialized with corresponding trigger
@heyflo

heyflo commented Jun 27, 2023

Copy link
Copy Markdown

This is a great option and the code actually looks clean to me. Is there any chances to see this merged any time soon?

@cafecitopuro

Copy link
Copy Markdown

+1 would also like to see this merged

@fromaline

Copy link
Copy Markdown
Author

Made this PR when I was a junior dev. Have nostalgic feelings now :)

@dkniffin dkniffin added this to the 1.0.0 milestone Mar 20, 2025
@dkniffin dkniffin added the enhancement User is requesting an enhancement/new feature label Mar 20, 2025
@dkniffin

Copy link
Copy Markdown
Contributor

@fromaline I just recently took over maintenance of micromodal.

I think this is a great idea for a new feature. However, I think it has potential to break things for people (eg, if they already have other behavior on the page that relies on the hash in a different way).

So, I think I'll aim to merge this in a 1.0 release, to indicate it's a potentially breaking change.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement User is requesting an enhancement/new feature

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants