I want to Hide full-window Modal when the back button of browser is pressed only on the particular page.

You haven’t mentioned LiveView before, so far we assumed regular statically rendered templates… As far as I remember push state support has been added recently and you should be able to use that to handle back/forward buttons from your liveview.

Hey @ycv005 you’ll need to provide additional details. How is the modal created? Can you show any code?

Just handling event which changes the value of @show_resume to True or False. By default, its value is false. <div class="modal fade fullscreen-modal <%= @show_resume and "show"%>" id="resumeModal" tabindex="-1" role="dialog" aria-hidden="true" style="<%= @show_resume and "display: block;"%>"> . . …

Do you want to use Live view or javascript (jquery, vue, vanilla javascript)? For plain javascript you can try How To Make a Modal Box With CSS and JavaScript Back button event handler https://stackoverflow.com/questions/25806608/how-to-detect-browser-back-button-event-cross-browser

As @NobbZ said, you can use pushState support in LiveView which would really make the things easy. With pushState in LiveView, when you show a modal you can update the URL (to something like /page/modal) without refreshing/changing the page. This new url is added to the browser history so when user…

Ya, I also saw your videos. Thanks to all.

Elixir Programming Language Forum

Hide Modal when Back button of browser is pressed

Questions & Help Questions

ycv005 July 2, 2019, 11:51am 5

It would be better if there is any way to do it in LiveView.