Modal Bootstrap用戶確認

-1

如何創建一個等待直到用戶確認是否真的要刪除數據的JQuery函數。Modal Bootstrap用戶確認

如何能夠做到這樣的事：

function UserConfirmation() 
{ 
    ShowModal(); //"Global" Delete Confirmation Bootstrap Modal 
    //Now wait till the user decides whether or not he really wants to 
    //delete data(Button events or on Modal hide). 
    //On user reply: 
    if(UserReplied == 'Delete') 
    {} 
    else 
    {} 
}

編輯：

這是模態在佈局的HTML代碼。這個ModalDelete會在需要時通過ShowModal（）函數調用。

<!-- Delete Data Confirmation Modal --> 
    <div class="modal fade" id="ModalDelete" role="dialog" data-backdrop="static" data-keyboard="false"> 
     <div class="modal-dialog modal-sm"> 

      <!-- Modal content--> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" id="btn-cancel" data-dismiss="modal">&times;</button> 
        <h4 class="modal-title">Confirm Delete</h4> 
       </div> 
       <div class="modal-body"> 
       </div> 
       <div class="modal-footer"> 
        <button type="button" class="btn btn-success" id="btn-cancel" data-dismiss="modal">Cancel</button> 
        <button type="button" class="btn btn-danger btn-delete" id="btn-delete" data-dismiss="modal">Delete</button> 
       </div> 
      </div> 

     </div> 
    </div>

功能UserConfirmation調用的ShowModal後監聽模態事件（），並按下按鈕或模式隱藏將取決於用戶的選擇進行。

我認爲這可以通過承諾或行動來實現。

來源

2015-08-30 Shyamal Parikh

數據存儲在哪裏？ – Chanckjh

Modal html被設計成佈局。如果那是你所問的。 –

從你得到'UserReplied'的值。你可以提供一個小提琴 –

可以使用http://nakupanda.github.io/bootstrap3-dialog例如，然後這樣的事情時，你需要刪除確認：

BootstrapDialog.show({ 
    title: 'Alert', 
     message: 'Are you sure you want to delete this ?', 
     buttons: [{ 
      label: 'Yes', 
      cssClass: 'btn-danger', 
      action: function(dialog) { 
       dialog.close(); 
       //your action 
      } 
     }, { 
      label: 'No', 
      action: function(dialog) { 
       dialog.close(); 
      } 
     }] 
    });`

來源

2015-08-30 18:53:33 kuniali

確定這裏是我如何解決使用jQuery的承諾延期的問題：

這函數偵聽，直到用戶單擊#ModalDelete中的按鈕並返回單擊的按鈕的ID。

function ModalOptionChoosen() { 

var deferred = $.Deferred(); 

$('#ModalDelete button').on('click', function (e) { 
    var $target = $(e.target); // Clicked button element 
    $(this).closest('.modal').on('hidden.bs.modal', function() { 
     //console.log($target); // Logged if the clicked button actually closed the modal 
     var result = $target.attr('id'); 
     deferred.resolve(result); 
    }); 
}); 

return deferred.promise(); 
};

而另一功能等待來自上述ModalOptionChoosen承諾（）將被返回。現在

function ShowModalWaitForResult() { 
    ShowModal(); 

    var promise = ModalOptionChoosen(); 
    promise.done(function (result) { 
     console.log(result); // log the user selected value 
    }); 
});

我可以引用ModalOptionChoosen功能任何地方，如果需要的話。

來源

2015-08-31 08:31:53

Modal Bootstrap用戶確認

回答

相關問題