Помогите с javascript...

[Victor_S]

Мужики, помогите с синтаксисом в javascript, а то я совсем не имел с ним дела...
Есть на страничке стандартный бутстраповский компонент табов. У него есть такой скриптик:
<script>
$(function () {
$('#myTab a[href="#profile"]').tab('show')
})
</script>
Как правильно подставить вместо #profile значение location.hash?
Поясню зачем, может другой путь подскажете...
На страничке несколько табов и в них есть свои формы. Они отправляют запрос на сервер, сервер обрабатывает запрос и перезагружает страницу. Нужно, чтобы при перезагрузке страницы отображалась та вкладка с которой послан запрос. Сервер указывает в адресе хэш вкладки.

[Velizar]

Значение нужно подставлять не вместо #profile, а в HTML <a> теге вкладки панели, или в событии onclick какого-то из элементов вкладки.

Чтоб сделать вкладку активной (по умолчанию активная первая) нужно добавить класс active

Код: Выделить всё

<div role="tabpanel" class="tab-pane active" id="home">...</div> 

Если вы хотите активировать (посредством JavaScript) вкладку по названию - достаточно записать так:

Код: Выделить всё

$('#myTab a[href="#profile"]').tab('show'); // Виберіть вкладку по назві      

Вот стандартный пример Bootstrap

Код: Выделить всё

<div role="tabpanel">

  <!-- Навігаційні елементи вкладок -->
  <ul id="myTab" class="nav nav-tabs" role="tablist">
    <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Home</a></li>
    <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Profile</a></li>
    <li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">Messages</a></li>
    <li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">Settings</a></li>
  </ul>

  <!-- Вкладки панелі -->
  <div class="tab-content">
    <div role="tabpanel" class="tab-pane active" id="home">...</div>
    <div role="tabpanel" class="tab-pane" id="profile">...</div>
    <div role="tabpanel" class="tab-pane" id="messages">...</div>
    <div role="tabpanel" class="tab-pane" id="settings">...</div>
  </div>

</div>
 

Вместо трех точек можете вставлять HTML код форм

[Victor_S]

Velizar, спасибо, конечно...но все это я видел в документации и сделал. Сами вкладки нормально работают и переключаются, но при обращении к страничке по адресу с хэшем я не могу попасть на определенную вкладку именно потому что у компонента жестко задана активная вкладка. Думал, может данный скрипт в состоянии динамически переключать вкладки в зависимости от хэша в адресе...

[Velizar]

Ну а так пробовали?

Код: Выделить всё

$(document).ready(function () {
    var activeTab = location.hash;
    $('#myTab a[href="'+activeTab+'"]').tab('show'); // Вибір вкладки по назві
});

обязательно задайте id="myTab" в тега <ul

[Victor_S]

Методом тыка добился требуемого эффекта так:
<script>
$(function () {
var myhash = String(location.hash);
if (myhash == "#vvod1") $('#v1 a[href="#vvod1"]').tab('show');
if (myhash == "#vvod2") $('#v1 a[href="#vvod2"]').tab('show');
if (myhash == "#archive") $('#v1 a[href="#archive"]').tab('show');
if (myhash == "") $('#v1 a[href="#vvod1"]').tab('show');
})
</script>