2016-08-25 87 views
0

我有一個刪除按鈕在我的表列上點擊該按鈕我想顯示引導模式的確認消息,但它刪除數據但不顯示模式。請幫助引導模式不會顯示在單擊按鈕上

我的語氣

<!-- modal confirm message --> 
<div class="modal fade" id="modal-confirm" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"> 
<div class="modal-dialog" role="document"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
      <h4 class="modal-title" id="exampleModalLabel">Enter Delatils</h4> 
     </div> 
    <div class="col-lg-12" id="message-box"></div> 
    <div class="modal-body"> 
     Are you sure? 
    <div class="modal-footer"> 
    <button type="button" id="btn-yes" class="btn btn-info"><span class="glyphicon glyphicon-floppy-save"></span></button> 
    </div> 
    <!-- /modal confirm message--> 

,這裏是我的javascript

$(document).on('click','#btn_delete',function(){ 
var id = $(this).data('id7'); 
$('#modal-confirm').modal({show:true}); 
$('document').on('click','#btn-yes', function(){ 
    $.ajax({ 
    url:'include/delete-client-class.php', 
    type:'POST', 
    data:{'id':id}, 
    dataType:'json', 
    success:function(data){ 
     alert(data); 
    } 

}); 
}); 

});

+0

您是否包含對引導程序js文件的引用? – n0m4d

回答

0

我最好的猜測是你可能沒有包含對引導js文件的引用,或者說jquery的版本高於引導的版本。

爲使本示例正常工作,您需要引用引導CSS:

<link data-require="[email protected]*" data-semver="4.0.0-alpha.2" rel="stylesheet" href="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/css/bootstrap.css" /> 

...在身,jQuery的文件引用後,您需要引用引導的js文件:

<script data-require="[email protected]" data-semver="1.9.1" src="https://code.jquery.com/jquery-1.9.1.js"></script> 
<script data-require="[email protected]*" data-semver="4.0.0-alpha.2" src="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/js/bootstrap.js"></script> 

請參閱此plunker示例,其中我試圖通過使用代碼的某些部分來模擬模態。