Showing posts with label BOOTSRAP. Show all posts
Showing posts with label BOOTSRAP. Show all posts

Wednesday, 28 October 2015

how detect modal bootsrap will open or close by clicking href

Hello guys, now i will give short tutorial about detect modal open or not, cause sometime programmers need this way to thorw variable inside modal or anything else based on your need it,

Here is my demo Chech This out

Here js detect modal open
  $('#myModal').on('shown.bs.modal', function(event) {  
  alert('modal open baby');  
 });  

Here href to open modal
 <button class="btn btn-info btn-lg" data-target="#myModal" data-toggle="modal" type="button">Open Modal</button>  

Here cancel button in the top
 
 <button aria-hidden="true" class="close" data-dismiss="modal" id="cancel" type="button">×</button>  
 Here cancel button in the bottom  
  <div class="modal-footer">  
 <button class="btn btn-primary" id="btnsubmit" type="button">Save</button>  
         <button class="btn btn-danger" data-dismiss="modal" id="btncancel" type="button">Cancel</button>  
       </div>  
Here js detect when users close or cancel modal
 //detect user close or cancel modal  
  $('#cancel,#btncancel').on("click", function(e) {  
     console.log('modal cancel or close');  
   });  

Saturday, 17 October 2015

PREVENT MODAL BOOTSRAP CLOSE BY CLICK AREA MODAL

Hello guys, good night here. to night i will give short tutorial about prevent modal bootsrap close by click around div. Sometime as programmers we need to guide users to follow our instruction. i have some form that users should close modal by click close button or cross button in modal cause i have design when user cancel or close it some data will remove frommy table but depend on your design.

so here is my simple demo here

the source came from http://stackoverflow.com/questions/22207377/disable-click-outside-of-bootstrap-model-area-to-close-modal  

Sunday, 5 July 2015

Tutorial make modal has scroll using bootsrap

Hi i will give simple tutorial about modal in bootsrap has scroll, Sometime we need a modify our template! Such as giving list to users, i'm trying to make diffrent things about, So check this out http://codepen.io/anon/pen/oXEKNg Feel free to comment or just say hai Freddy