Bootstrap open another modal popup from one modal popup and on closing the second modal show the previous one

1. Open first popup
2. click a button inside that popup
	- save the current popup somewhere and close it
	- show the login popup
	- on clicking close button on login popup show the previous popup back


Solution:

	1. Add a custom class to the "modal" & name it : "saveState"
		- so the current popup can be shown back if the user closes the "sub-popup"



first modal: -> .first-modal-class
second Modal: -> .second-modal-class

add this data attr to the close to save the previous popup's name "data-previouPopup-toggle"

	--- Second modal's close button: .second-modals-close

#Here is the javascript
		$('.modal-switch-btn').click(function(){
        	var prevPopup = $(this).attr("data-previouspopup-toggle");
        	$(prevPopup).modal('show');
	    });
	    
	    
	    
#Here is the Html markup

<!-- Trigger the modal with a button -->
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>


<!-- Trigger the modal with a button -->
<button type="button" class="btn btn-info btn-lg">Open Modal</button>

<div id="myModal" class="modal fade first-modal-class" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
      </div>
      <div class="modal-body">
        <p>Some text in the modal.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>





<div id="myModal2" class="modal fade second-modal-class" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close second-modal-close" data-previouspopup-toggle=".first-modal-class" data-dismiss="modal">&times;</button>
      </div>
      <div class="modal-body">
        <p>Some text in the modal.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>

A detailed blog with an example: http://wp.me/p3Osmq-uf