我想在按钮单击时重新加载页面并在新选项卡中执行路由操作

Question

<form action="{{ route('payForEveryVoucherAndInvoice') }}" method="post" >
                                @csrf
                                <div class="row">
                                    <div class="col-sm-4">
                                        <div class="form-group">
                                            <select id="payment_method" class="form-control" name="payment_method" required>
                                                <option value="" selected="selected" disabled="disabled">Payment</option>
                                                <option value="cash">Cash</option>
                                                <option value="credit">Credit</option>
                                                <option value="debit">Debit</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="col-sm-1">
                                    <input type="text" name="driver" value="{{$voucher_driver}}" hidden>
                                    </div>
                                    <div class="col-sm-5">
                                        <button class="btn btn-primary" style="background-color: #262533; border-color: #262533" onClick="refreshPage()" formtarget="_blank">All Entries Paid</button>
                                    </div>
                                </div>
                            </form>

这是我的表格。我正在使用 onClick="refreshPage()" 来刷新我的页面。

<script>
    function refreshPage(){
        window.location.reload();
    }
</script>

这是脚本。但是当我按下按钮时。它只是重新加载页面，也不会继续前进。我想重新加载页面并打开另一个选项卡来执行路由操作。

有什么帮助吗？提前致谢。

Answer 1

您需要为此调用提交事件。

<script>
    function refreshPage(){
        $("form").submit();
        window.location.reload();
    }
</script>

我建议不要这样做。如下使用ajax。

$('body').on('submit', 'form', function (e) {
    e.preventDefault();
    $.ajax({
        url: $(this).attr('action'),
        data: new FormData(this),
        type: 'POST',
        contentType: false,
        cache: false,
        processData: false,
       
        success: function (data) {
           window.location.reload();
        },
    });
});