Jumat, 08 April 2016

Script menutup modal box atau dialog box tidak selalu membuahkan hasil seperti yang kita harapkan. Kadang berhasil, kadang pula meninggalkan backdrop seperti punya saya ini. Mungkin terjadi karena saat proses close ter override dengan proses yang lain.


scriptnya:

<!-- Trigger the modal with a button -->
<input type="hidden" id="btn-payment" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">

<!-- Modal -->
<div id="myModal" class="modal fade" 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>
        <h4 class="modal-title">Pembayaran</h4>
      </div>
      <div class="modal-body">
      </div>
      <div class="modal-footer">
        <button class="btn btn-danger" id="custom-close" data-dismiss="modal" aria-hidden="true">Batal</button>
<button id="simpan-payment" class="btn btn-success">Bayar</button>
      </div>
    </div>
  </div>
</div>
dan JS nya seperti berikut
 $("#simpan-payment").click(function(){
//berbagai proses dan setelah itu menutup modal   
 $(".close").click();
})
berbagai cara saya coba mulai dari
1. $(".close").click();
2. $('#myModal').modal('hide');
3. $("#custom-close").click(); 

ketiganya hanya menutup modal box dan meninggalkan backdrop(mungkin hanya terjadi pada project tertentu). Berikut solusi untuk menutup modalbox yang meninggalkan backdrop.

setTimeout(function(){
           $("[data-dismiss=modal]").trigger({ type: "click" });
},100)

Terima Kasih atas kunjungannya dan Semoga Bermanfaat.

1 komentar:

Subscribe to RSS Feed Follow me on Twitter!