Question

我使用bootstrap模式导出 excel ，但在提交我的模态后不关闭。我必须手动关闭。

<button type="button" id="taxModal" class="btn btn-primary btn-group-xs">INVOICE SUMMARY</button>

<div id="taxesModal" class="modal fade">
        <div class="modal-dialog">
            <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">GENERATE TAX INVOICE</h4>

                </div>
                <div class="modal-body">
                    <form class="form-horizontal" role="form" method="POST" action="{{ url('/invoice') }}">
                        {!! csrf_field() !!}

                        <div class="form-group{{ $errors->has('start_date') ? ' has-error' : '' }}">
                            <label class="col-md-4 control-label">START DATE</label>

                            <div class="col-md-6">
                                <input type="date" class="form-control" name="start_date">

                                @if ($errors->has('start_date'))
                                    <span class="help-block">
                                        <strong>{{ $errors->first('start_date') }}</strong>
                                    </span>
                                @endif
                            </div>
                        </div>

                        <div class="form-group{{ $errors->has('end_date') ? ' has-error' : '' }}">
                            <label class="col-md-4 control-label">END DATE</label>

                            <div class="col-md-6">
                                <input type="date" class="form-control" name="end_date">

                                @if ($errors->has('end_date'))
                                    <span class="help-block">
                                        <strong>{{ $errors->first('end_date') }}</strong>
                                    </span>
                                @endif
                            </div>
                        </div>
                        <div class="form-group ">
                            <div class="col-md-3 col-md-offset-3">
                                <button type="submit" class="btn btn-primary form-control" id="btnSubmit" >Submit</button>
                            </div>
                            <div class="col-md-3">
                                <button type="button" class="btn btn-danger form-control" data-dismiss="modal">Close</button>
                            </div></div>
                    </form>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
    <!-- /.modal -->

从我的控制器中成功生成Excel文档，但我的模态在提交后没有关闭。我在我的按钮中累了data-dismiss="modal"但是在提交表单之前模态会关闭。在我的控制器中，我尝试了return rediect();，这也是行不通的。我使用下面的脚本打开这个模态

$(document).ready(function () {
        $("#taxModal").click(function () {
            $("#taxesModal").modal('show');
        });

    });

我的控制器功能

 public function invoice_create()
    {
     $start = Input::get('start_date');
     $end = Input::get('end_date');
    Excel::create('INVOICE SUMMERY', function($excel) use($sum,$tot,$start,$end)    {
$excel->sheet($start.'_'.$end, function($sheet) use($sum,$tot,$start,$end){
})->export('xls');
}}

我的路线：

Route::post('invoice','HvAccountController@invoice_create');

Answer 1

在提交活动中关闭你的模态。

    $(document).on("click","#btnSubmit",function (event) {
        ajaxCall();
    });

    function ajaxCall() {
       $.ajax({
           url : 'example.com',
           type: 'GET',
           success : resData
       })
     }

   function resData(data){
        $("#taxesModal").modal('hide');
   }

Answer 2

你可以用一些jQuery做到这一点：

$('#btnSubmit').on("click", function(event) {
    // submit form via ajax, then

    event.preventDefault();
    $('#taxesModal').modal( 'hide' );
});

您只需编写一个AJAX调用即可将表单数据发送到正确的位置进行处理。像这样的东西可以解决这个问题：

$.ajax({
      url: "{{ url('/invoice') }}",
      method: "POST",
      data: { //Your data to send - needs to include CSRF token
      }
});

如何在Laravel上提交表单后关闭Bootstrap Modal？

2 个答案: