BootStrap模式不希望被关闭

时间:2015-11-03 00:28:58

标签: javascript jquery html ajax bootstrap-modal

我正在使用BootStrap 我打开一个模态(模态在文件中)。

<div id="buy-function" class="modal fade" role="dialog">
<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="gridSystemModalLabel">Achat </h4>
  </div>
<div class="modal-body">
    <div class="row">
      <div class="col-md-12">
      <form class="operation" role="form"  method="post" >
          <div class="form-group">
            <label for="quantite" class="col-sm-3 control-label">Quantitée : </label>
            <div class="col-sm-9">
              <input type="number" class="form-control" id="buy_live_quantite" name="quantite" value="10" >
            </div>
          </div>
          <div class="form-group">
            <label for="justif" class="col-sm-3 control-label">Justification : </label>
            <div class="col-sm-9">
              <textarea rows="3" class="form-control" id="justif" name="justif"></textarea>
            </div>
          </div> 
        </form> 
      </div>
    </div>
  </div>
<!--<div class="modal-footer"></div>

  <div id="live_invoice"></div>-->

    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Fermer</button>
      <button type="button" id="new_operation" class="btn btn-info">Acheter</button>
    </div>

</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

我用按钮打开一个模态。

    <div class="box-body">
                <button type="button" class="btn btn-block btn-info btn-lg" data-toggle="modal" data-target="#buy-function">Acheter</button>
                <button type="button" class="btn btn-block btn-warning btn-lg" data-toggle="modal" data-target="#sell-function">Vendre</button>
            </div>

但是,当我想关闭这个模态时 (我用 $('#buy-function').modal('hide');),

我的剧本:

<script>
$(document).ready(function () {
$("button#new_operation").click(function(){
    $.ajax({
        type: "POST",
        url: "/views/composants/new_operation.php", //process 
        data: $('form.operation').serialize(),
        success: function(msg){
            //alert(msg);
            $('#buy-function').modal('hide'); //hide popup  
        },
        error: function(){
            alert("failure");
        }
    });
});
});
</script>

它不起作用。有什么想法吗?

1 个答案:

答案 0 :(得分:3)

检查您是否多次不包含jQuery。 Bootstrap将仅将其应用于第一个实例,当jQuery再次启动时,它将丢失。