如何在分页页面上停止自动加载javascript?

时间:2018-05-12 06:57:28

标签: javascript laravel

基本上,我每隔2秒刷新一次订单表。它会查询名为“autoload'它在OrdersController中触发一个名为autoloadOrders的方法。控制器只返回部分刀片文件的视图,其中包含表格的循环(传递必要的变量)。

我的问题是,刷新工作正常,表自动更新。但是对于分页,当我点击下一页时,它会每2秒自动恢复到第一页数据。一旦我进入分页,我怎么能阻止这种情况发生呢?

welcome.blade.php

<script>
            $(document).ready(function() {
                setInterval(function() {
                    $('#autoload').load('{{ route('autoload') }}');
                }, 2000);
            });
        </script>
    <main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">
        <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
            <h1 class="h2">Dashboard</h1>
        </div>

        <h2>View Orders</h2>
        <div class="table-responsive" id="autoload">
            <table class="table table-striped table-sm">
                <thead>
                <tr>
                    <th>id</th>
                    <th>phone</th>
                    <th>address</th>
                    <th>order</th>
                    <th>price</th>
                    <th>delivered</th>
                </tr>
                </thead>
                <tbody>
                @foreach ($orders as $order)

                <tr>
                    @if ($order->delivered == false)
                    <td>{{$order->id}}</td>
                    <td>{{$order->phone}}</td>
                    <td>{{$order->address}}</td>
                    <td>{!! nl2br($order->products) !!}</td>
                    <td>${{$order->price}}</td>
                        @if ($order->pickup == true)
                            <td><a href="/admin/orders/pickup/{{$order->id}}">Pickup</a></td>
                        @else
                            <td><a href="/admin/orders/deliver/{{$order->id}}">No</a></td>
                            @endif

                     @endif
                </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
        {{$orders->links()}}

autoload.blade.php

<div class="table-responsive" id="autoload">
    <table class="table table-striped table-sm">
        <thead>
        <tr>
            <th>id</th>
            <th>phone</th>
            <th>address</th>
            <th>order</th>
            <th>price</th>
            <th>delivered</th>
        </tr>
        </thead>
        <tbody>
        @foreach ($orders as $order)

            <tr>
                @if ($order->delivered == false)
                    <td>{{$order->id}}</td>
                    <td>{{$order->phone}}</td>
                    <td>{{$order->address}}</td>
                    <td>{!! nl2br($order->products) !!}</td>
                    <td>${{$order->price}}</td>
                    @if ($order->pickup == true)
                        <td><a href="/admin/orders/pickup/{{$order->id}}">Pickup</a></td>
                    @else
                        <td><a href="/admin/orders/deliver/{{$order->id}}">No</a></td>
                    @endif

                @endif
            </tr>
        @endforeach
        </tbody>
    </table>

OrdersController

public function autoloadOrders(Orders $orders)
    {
        return view('admin.partials.autoload')->with(['orders' => $orders->getUndeliveredOrders()]);
    }

路线:

Route::get('autoload', 'OrdersController@autoloadOrders')->name('autoload');

1 个答案:

答案 0 :(得分:0)

我用这个解决了它

var object = (app.productsPag.find(({ _id }) => _id ===data.id) || {})
        .description = data.description;