2

My website has a payment form in a modal. All I want is (for some specific customers) to pass them a link and when they click on it to move to the website with the modal already be open. Is that possible?

Jim
  • 407
  • 1
  • 11
  • 24

1 Answers1

4

You must facilitate the feature yourself. Lets say you have normal bootstrap modal like this :

<div class="modal fade" id="payment">
  <div class="modal-dialog">
    <div class="modal-content">
      ...
    </div>
  </div>
</div>

and you want to invoke the modal on page load in a link sent to some users :

http://www.example.com#payment

Then add this code snippet to your page :

$(document).ready(function() {  
  var modals = ['#payment', '#anotherModal'];
  if (window.location.hash && ~modals.indexOf(window.location.hash)) {
     $(window.location.hash).modal();
  }
})

This is of course by far the most simple way to do it.

davidkonrad
  • 83,997
  • 17
  • 205
  • 265
  • The thing is editing the link like this it turns automatically separated by a fwd slash. Here you can test it: https://jimmydance.com#basicModal3 – Jim Jan 27 '16 at 20:29
  • `window.location.hash` will return `#payment` in both cases - `http://www.example.com#payment` / `http://www.example.com/#payment` – davidkonrad Jan 27 '16 at 21:19
  • Ever since I added the script it works as expected but it raised an issue. If you open the https://jimmydance.com#home and refresh the page then a shadow appears in the layout making navbar and all other links not clickable. Any suggestion? – Jim Feb 02 '16 at 05:39
  • @Jim, Yes - this is because the supposed modal is shown right away without checking, you actually have a `#home` element (and others, and thats good) - but accidently `#home` which not is a modal is trying to be shown as modal - the weird blackening of the view is the modals backdrop. We must of course check if the hash fragment actually represent a modal we want to show - see update. Edit the arrays `var modals = ['#payment', '#anotherModal'];` so it hold the `id`'s of the modals you want to show by a direct link. – davidkonrad Feb 02 '16 at 07:34
  • Excellent! Once again, THANK YOU! – Jim Feb 02 '16 at 09:24
  • 2
    Future readers: for more reference, see [What does a tilde do when it precedes an expression?](http://stackoverflow.com/questions/12299665/what-does-a-tilde-do-when-it-precedes-an-expression) – showdev Oct 13 '16 at 20:02