如何使用Ajax从另一个页面操作引导选项卡

Question

我的Laravel项目中有一个视图，在第一个选项卡中显示了所有产品，在第二个选项卡中，当我输入以验证某个产品时，我会被重定向到第一个选项卡处于活动状态的视图，每次重定向到我的视图时，为了访问某个处于保留状态的产品，按下第二个标签确实是浪费时间。

因此，我希望在重定向时激活第二个选项卡，我如何在ajax成功功能中实现这一点，这是我的脚本，位于修改视图中，该脚本的目标是拒绝或接受产品，以便它在我的第一个视图中显示所有产品，该视图包含选项卡：

<script type="text/javascript">
$(".Visibilite").click(function (e) {
e.preventDefault();
var ele = $(this);
$.ajax({
url: '{{ url('change-visibility') }}',
method: "post",
cache: false,
data: {_token: '{{ csrf_token() }}', produit_id: ele.attr("data-id"), status: ele.attr("data-status")},
success:function(data) {
window.location.replace('{{ url("NouveauProduits") }}');
}
});
});
</script>

以及我的选项卡结构：

<li class="nav-item">
<a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" aria-controls="home" aria-expanded="true">
Tous les produits <i class="la la-list-alt"></i>
</a>
</li>

<li class="nav-item">
<a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" aria-controls="profile" aria-expanded="false">
Noueaux produits  <i class="ficon ft-bell bell-shake"></i>  <span class="badge badge-pill badge-glow badge-danger float-right">@if ($unvisible->count()>0) {{ $unvisible->count() }} @endif</span>
</a>
</li>

Answer 1

在重定向页面中：

如果您使用的是bootstrap 4.x，您可以通过编程方式切换到该选项卡

$(function () {
$('#myTab a[href="#profile"]').tab('show')
})

引导程序5.x

var firstTabEl = document.querySelector('#myTab a[href="#profile"]')
var firstTab = new bootstrap.Tab(firstTabEl)
firstTab.show()
// Or 
var firstTab = new bootstrap.Tab($('#myTab a[href="#profile"]'))
firstTab.show()