Skip to main content

bootstrap, Modal - How to get Bootstrap Modal's invoke or source element?

How to get Bootstrap Modal invoke or source element?

$('#your-modal').on('show.bs.modal', function (e) {
  var $invoker = $(e.relatedTarget);
});

Various events of modal popup are:


  1. show.bs.modal: fired just before the modal is open.
  2. shown.bs.modal: fired after the modal is shown.
  3. hide.bs.modal: fired just before the modal is hidden.
  4. hidden.bs.modal: fired after the modal is closed.

How to open a Bootstrap modal window using jQuery?


$('#myModal').modal('show') // initializes and invokes show immediately

Bootstrap has a few functions that can be called manually on modals:

$('#myModal').modal('toggle');

You can check more documentation here
https://getbootstrap.com/docs/3.4/javascript/

$('#myModal').modal('show');
$('#myModal').modal('hide');

Comments

Popular posts from this blog

IIS, There was an error when trying to connect. Do you want to retype your credentials and try again?

IIS 8 error on windows server 2012 insufficient permission There was an error when trying to connect. Do you want to retype your credentials and try again? Details: Filename: \?\C:Windows\system32\inetsrv\config\redirection.config Error: Cannot read configuration file due to insufficient permissions screenshot: Solution: Steps to short out this issue: go to C:\Windows\Microsoft.Net\Framework64\v2.0.50727\CONFIG\machine.config here you got the redirection tag like the below <configurationredirection enabled="true" password="[enc:IISCngProvider:X0ObCWwZ4+PrTHiFVPtzFeCcL8u5P6KUOYfo1/0QrgZWATA5pKWqHvD8nL2crNJKyyqr4z/rBdLPjdRcaLxAMMj4l+lvp5EXXKSXueolvyGa34F4QZfbBVCM6oVNcq3M368TOTVjJv4POVFQWvu0MDVlGgReglXB+Lw5BRI4Htw=:enc]" path="C:\Windows\System32\inetsrv\config\import\" username="Administrator"> </configurationredirection"></li"> you need to change this to <configurationRedirection /> Th...

Wordpress - Contact Form 7 notification open in popup - Bootstrap modal popup

How to add open Contact form 7 Notification / Messages in Modal popup We can use the Bootstrap modal popup and Contact form 7 Doom Events to create the popup. Paste the below code in the functions.php, it will work for you (please change the messages as per the requirements): add_action('wp_footer', 'munesh_Footertext'); function munesh_Footertext() { echo '<div class="modal fade in formids" id="myModal2" role="dialog" tabindex="-1">     <div class="modal-dialog">       <!-- Modal content-->       <div class="modal-content no_pad text-center">          <button type="button" class="close" data-dismiss="modal">&times;</button>         <div class="modal-header heading">           <h3 class="modal-title" id="MSTitle">Message Sent!</b></h3>         </div>      ...