Saya memiliki permintaan $.post() bernama "HasIncreasePoint" dan jika data yang dikembalikan dari server menunjukkan keberhasilan (e.IsSuccess), saya tidak ingin membuka dialog modal bootstrap, dan menyelesaikan proses acara klik.
$('a[data-toggle="modal"]').on('click', function (event) {
$.post("@Url.Action("HasIncreasePoint")", function (e){
if (e.IsSuccess) {
alert("error!please not to open the modal!");
event.preventDefault();
event.stopPropagation();
$('a[data-toggle="modal"]').off("click");
}else{
// From the clicked element, get the data-target arrtibute
// which BS3 uses to determine the target modal
var target_modal = $(e.currentTarget).data('target');
// also get the remote content's URL
var remote_content = e.currentTarget.href;
// Find the target modal in the DOM
var modal = $(target_modal);
// Find the modal's <div class="modal-body"> so we can populate it
var modalBody = $(target_modal + ' .modal-body');
// Capture BS3's show.bs.modal which is fires
// immediately when, you guessed it, the show instance method
// for the modal is called
modal.on('show.bs.modal', function () {
// use your remote content URL to load the modal body
modalBody.load(remote_content);
}).modal();
// and show the modal
// Now return a false (negating the link action) to prevent Bootstrap's JS 3.1.1
// from throwing a 'preventDefault' error due to us overriding the anchor usage.
return false;
}
});
});
Dan kode HTMLnya:
<a class="btn-check-in" href="@Url.Action("ReverseCard")" data-toggle="modal" data-target="#myModal" id="btn-sign">
<i></i><span>SignIn</span>
</a>
6
MapleStory
6 September 2016, 15:25
Pertama coba dengan panggilan ajax sinkron, yang Anda gunakan adalah async (yang berarti klik telah dipicu sebelum Anda mendapatkan data respons).
– skobaljic
6 September 2016, 15:31
1 menjawab
Jawaban Terbaik
Anda dapat menghapus atribut data-toggle="modal" dan mengikat klik pada kelas .btn-check-in.
Kemudian, kapan pun Anda membutuhkan modal, buka menggunakan javascript (seperti yang sudah Anda lakukan)
<a class="btn-check-in" href='@Url.Action("ReverseCard")' data-target="#myModal" id="btn-sign">
<i></i><span>SignIn</span>
</a>
J:
// set a flag to prevent multiple requests:
var waiting = 0;
$('.btn-check-in').on('click', function(event){
event.preventDefault();
if(!waiting){
var myModal = $(this).data('target');
var remote_content = this.href;
$.post('@Url.Action("HasIncreasePoint")').done(function(e){
if(!e.IsSuccess){
// this part seems to be overdone, but I left it as is
// as I don't know what is your reason of loading fresh content each time...
$(myModal).on('show.bs.modal', function(){
$(this).find('.modal-body').load(remote_content);
}).modal('show');
}else{
// it was successful!
}
waiting = 0;
});
}
waiting = "I'm waiting for $.post()";
});
3
Artur Filipiak
6 September 2016, 20:07