【发布时间】:2021-04-03 15:10:21
【问题描述】:
抱歉这个菜鸟问题。
我有:
• 一个网页中的不同标签和
• 每个选项卡都有一个分页
问题是,当点击不同分页的页面时,它会:
• 指向同一个标签
就像我在 tab_2 分页中点击了第 2 页,然后我被重定向到 tab_1 第 1 页
在我的 InventoryController 中:
public function index() {
return view('employee.inventory', [
'ingredients' => Ingredient::with('supplier')->paginate(10),
'products' => $products = Product::paginate(10, ['*'], 'products_page'),
'orders' => Order::paginate(10, ['*'], 'orders_page'),
'users' => User::paginate(10, ['*'], 'users_page'),
'suppliers' => Supplier::paginate(10, ['*'], 'suppliers_page')
]);
}
我该怎么办?我认为使分页中的每个页面都表现得像会跳转到 id 的锚标记,但我正在使用 {!! $object->links() !!} 但我不知道如何实现它。
<div class="col-md-6">
<!-- Custom Tabs -->
<div class="nav-tabs-custom">
<ul class="nav nav-tabs table-tabs" style="display: flex; flex-directed: row-reverse;">
<li class="active"><a href="#tab_1" data-toggle="tab" aria-expanded="true">
<button style="background-color: #C6B877; width:100px; color: white;" type="button" class="btn btn-default">
Ingredients
</button>
</a></li>
<li class=""><a href="#tab_2" data-toggle="tab" aria-expanded="false">
<button style="background-color: #C6B877; width:100px; color: white;" type="button" class="btn btn-default">
Products
</button>
</a>
</li>
<li class=""><a href="#tab_3" data-toggle="tab" aria-expanded="false">
<button style="background-color: #C6B877; width:100px; color: white;" type="button" class="btn btn-default">
Orders
</button>
</a></li>
<li class=""><a href="#tab_4" data-toggle="tab" aria-expanded="true">
<button style="background-color: #C6B877; width:100px; color: white;" type="button" class="btn btn-default">
Users
</button>
</a></li>
<li class=""><a href="#tab_5" data-toggle="tab" aria-expanded="true">
<button style="background-color: #C6B877; width:100px; color: white;" type="button" class="btn btn-default">
Suppliers
</button>
</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="tab_1">
<div class="card" style="width: 87.5em; height: 45em;">
<div class="card-header">
<h3 class="card-title">Ingredients</h3>
<div class="table-add-delete" style="float: right;">
<i class="fas fa-plus-square" data-toggle="modal" data-target="#modal-default-1" style="cursor:pointer ;color: #2AC0CC; font-size: 24px;"></i>
<i class="fas fa-trash-alt" data-toggle="modal" data-target="#modal-default-1" style="cursor: pointer; color: #2AC0CC; font-size: 24px;"></i>
</div>
</div>
<!-- /.card-header -->
<div class="card-body">
<div id="example2_wrapper" class="dataTables_wrapper dt-bootstrap4"><div class="row"><div class="col-sm-12 col-md-6"></div><div class="col-sm-12 col-md-6"></div></div><div class="row"><div class="col-sm-12">
<table id="table1" class="table table-bordered table-hover dataTable dtr-inline" role="grid" aria-describedby="example2_info">
<thead>
<tr role="row">
<th><input type="checkbox" name="checkAll" id=""></th>
<th>ID</th>
<th>NAME</th>
<th>QUANTITY IN STOCK</th>
<th>SUPPLIER</th>
<th>COST</th>
</tr>
</thead>
<tbody>
@foreach ($ingredients as $ingredient)
<tr>
<td><input type="checkbox" name="" id=""></td>
<td>{{$ingredient->ingredient_id}}</td>
<td>{{$ingredient->name}}</td>
<td>{{$ingredient->stock_Quantity}}</td>
<td>{{$ingredient->supplier->name ?? '--unset--'}}</td>
<td>{{$ingredient->cost}}</td>
</tr>
@endforeach
</tbody>
</table></div></div>
<div class="row"><div class="col-sm-12 col-md-5">
</div>
<div class="col-sm-12 col-md-7">
{!! $ingredients->links() !!}
</div>
</div>
</div>
</div>
<!-- /.card-body -->
</div>
<div class="tab-pane" id="tab_2">
<div class="card" style="width: 87.5em; height: 45em;">
<div class="card-header">
<h3 class="card-title">Products</h3>
<div class="table-add-delete" style="float: right;">
<i class="fas fa-plus-square" data-toggle="modal" data-target="#modal-default-2" style="cursor:pointer ;color: #2AC0CC; font-size: 24px;"></i>
<i class="fas fa-trash-alt" data-toggle="modal" data-target="#modal-default-2" style="cursor: pointer; color: #2AC0CC; font-size: 24px;"></i>
</div>
</div>
<!-- /.card-header -->
<div class="card-body">
<div id="example2_wrapper" class="dataTables_wrapper dt-bootstrap4">
<div class="row">
<div class="col-sm-12 col-md-6"></div>
<div class="col-sm-12 col-md-6"></div>
</div>
<div class="row">
<div class="col-sm-12">
<table id="table2" class="table table-bordered table-hover dataTable dtr-inline" role="grid" aria-describedby="example2_info">
<thead>
<tr role="row">
<th class="sorting" tabindex="0" aria-controls="example2" rowspan="1" colspan="1" ><input type="checkbox" name="AllProducts" id=""></th>
<th class="sorting_asc" tabindex="0" aria-controls="example2" rowspan="1" colspan="1" aria-sort="ascending">ID</th>
<th class="sorting" tabindex="0" aria-controls="example2" rowspan="1" colspan="1" >NAME</th>
<th class="sorting" tabindex="0" aria-controls="example2" rowspan="1" colspan="1" >DESCRIPTION</th>
<th class="sorting" tabindex="0" aria-controls="example2" rowspan="1" colspan="1" >QUANTITY</th>
<th class="sorting" tabindex="0" aria-controls="example2" rowspan="1" colspan="1" >IMAGE</th>
<th class="sorting" tabindex="0" aria-controls="example2" rowspan="1" colspan="1" >PRICE</th>
<th class="sorting" tabindex="0" aria-controls="example2" rowspan="1" colspan="1" >CATEGORY(s)</th>
</tr>
</thead>
<tbody>
@foreach ($products as $product)
<tr role="row" class="odd">
<td><input type="checkbox" name="" id=""></td>
<td tabindex="0" class="sorting_1">{{$product->product_id}}</td>
<td>{{$product->name}}</td>
<td>{{$product->description}}</td>
<td>{{$product->stock_Quantity}}</td>
<td><img style="height: 100px; width: 150px;" src="{{ asset('storage/' . $product->image) }}" alt="{{ 'storage/' . $product->image }}"></td>
<td>{{$product->price}}</td>
<td>#</td>
@endforeach
</tbody>
</table>
</div>
</div>
<div class="row">
<div class="col-sm-12 col-md-5">
</div>
<div class="col-sm-12 col-md-7" >
{!! $products->links() !!}
</div>
</div>
</div>
</div>
<!-- /.card-body -->
</div>
【问题讨论】:
-
你能发布库存视图吗
-
@alprnkeskekoglu ,每当我在 tab_2 分页中单击第 2 页时,它都会将我重定向到 tab_1 第 1 页,而不是直接转到 tab_2 第 2 页
标签: laravel bootstrap-4 pagination