重定向回 Laravel 中的特定选项卡窗格
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/33747262/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Redirect back to a specific tab pane in Laravel
提问by cyber8200
I have a index view with 5 tabs. When I click on Hardwaretab, this is what I see.
我有一个带有 5 个选项卡的索引视图。当我单击硬件选项卡时，这就是我所看到的。
When click on create, I launch this Modal
当点击创建时，我启动这个模态
As soon as I submit, I got an alert notification, and everything is store fine.
我一提交，就收到了警报通知，一切都很好。
But it direct me to my first tab. How can I redirect back to my second tab ?
但它引导我进入我的第一个标签。如何重定向回我的第二个选项卡？
Store Function
存储功能
public function store() {
$inputs = Input::all();
unset($inputs['_token']);
$cpe_mac = $inputs['mac1'].$inputs['mac2'].$inputs['mac3'].$inputs['mac4'].$inputs['mac5'].$inputs['mac6'];
$cpe = [];
$cpe['cpe_mac'] = $cpe_mac;
$cpe['bandwidth_max_up'] = (int)$inputs['max_up'];
$cpe['bandwidth_max_down'] = (int)$inputs['max_down'];
$json = json_encode($cpe);
$url = 'http://172.16.139.129:1234/vse/vcpe';
$ch = curl_init($url);
curl_setopt($ch, CURLOPT_HTTPHEADER, array('Content-Type: application/json'));
curl_setopt($ch, CURLOPT_POSTFIELDS, $json);
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
$result = curl_exec($ch);
curl_close($ch);
$result_json = json_decode($result, true);
$id = $inputs['account_id'];
if ( $result_json['status'] == '200') {
return Redirect::to('/account/'.$id.'/#hardware') ->with('success','The CPE was created succesfully!');
} else {
return Redirect::to('/account/'.$id.'/#hardware') ->with('error', $result_json['message']);
}
}
Tab.blade.php
Tab.blade.php
<!-- Nav tabs -->
<ul class="nav nav-tabs">
<li class=""><a href="#details" data-toggle="tab"><strong>Details</strong></a></li>
<li class=""><a href="#hardware" data-toggle="tab"><strong>Hardware(s)</strong></a></li>
<li class=""><a href="#access-methods" data-toggle="tab"><strong>Access Methods</strong></a></li>
<li class=""><a href="#linked-networks" data-toggle="tab"><strong>Linked Networks</strong></a></li>
<li class=""><a href="#options" data-toggle="tab"><strong>Options</strong></a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content mb30">
@include('account.show.details')
@include('account.show.hardwares')
@include('account.show.access-methods')
@include('account.show.linked-networks')
@include('account.show.options')
</div>
回答by Milan Maharjan
You can extract the tab name(#hardware) and pass it into the view. and in view you can do something like this
您可以提取选项卡名称（#hardware）并将其传递到视图中。鉴于你可以做这样的事情
<li class="{{ empty($tabName) || $tabName == 'hardware' ? 'active' : '' }}"><a href="#hardware" data-toggle="tab"><strong>Hardware(s)</strong></a></li>
and similarly in the included tab contents, you will have a element with class="tab-pane". Also add this condition to that element, something like
同样在包含的选项卡内容中，您将拥有一个 class="tab-pane" 的元素。还要将此条件添加到该元素，例如
<div id="hardware" class="tab-pane {{ !empty($tabName) && $tabName == 'hardware' ? 'active' : '' }}">
回答by Maxim Lanin
As far as you use hashes in your urls, it is more easier to do like this:
就您在 url 中使用哈希而言，这样做更容易：
var url = document.location.toString();
if (url.match('#')) {
$('.nav-tabs a[href=#'+url.split('#')[1]+']').tab('show') ;
}
$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
window.location.hash = e.target.hash;
});
It will change hash on every tab click and open the tab if the page is loaded with any tab's hash.
如果页面加载了任何选项卡的哈希值，它将在每次单击选项卡时更改哈希值并打开该选项卡。
回答by Satish Danda
$(document).ready(function(){
$('a[data-toggle="tab"]').on('show.bs.tab', function(e) {
localStorage.setItem('activeTab', $(e.target).attr('href'));
});
var activeTab = localStorage.getItem('activeTab');
if(activeTab){
$('#IDOFTAB a[href="' + activeTab + '"]').tab('show');
}
});
