Вкладки пользовательского интерфейса JQuery: как изменить выбранную вкладку из обратного вызова, предоставленного для события «выбор»? - PullRequest
0 голосов
/ 21 августа 2011

Я использую вкладки пользовательского интерфейса JQuery, и я добавил функцию обратного вызова к событию select, и я хочу изменить выбранную вкладку из этой функции:

$('#tabs').tabs({
  select: funciton () {
    // here I have to change the tab, that have been just selected, to another one
  }
});

Например, у меня есть три формы, по одной под каждой вкладкой. Пользователь должен заполнить их в правильном порядке, сначала, затем второй, а затем последний. Если пользователь заполняет первую форму, а затем нажимает на третью вкладку, я должен перенаправить его на вторую вкладку программно. Я достиг этой цели, визуально смоделировав выбор второй вкладки, но я думаю, что это не лучшее решение:

$('#tabs').tabs({
  select: funciton (event, ui) {
    if (ui.index > 2 && !$('#form2').valid()) {
      // here I have to change the tab, that have been just selected, to another one
      $('#tabs ul.ui-tabs-nav li').removeClass('ui-state-focus ui-tabs-selected ui-state-active');
      $('#tabs ul.ui-tabs-nav a[href="#tab2"]').parent('li').addClass('ui-state-focus ui-tabs-selected ui-state-active');
      $('#tabs div.ui-tabs-panel').addClass('ui-tabs-hide');
      $('#tabs div#tab2').removeClass('ui-tabs-hide');
    }
  }
});

Ответы [ 2 ]

0 голосов
/ 22 августа 2011

Я согласен с PetersenDidIt, но, думаю, проще продемонстрировать это с помощью некоторого кода:

var $tabs = $('#tabs').tabs({ disabled: [1, 2] });

$('#buttonToEnableTab2').click(function() {
    $tabs.tabs({disabled: [2]});
});

$('#buttonToEnableAllTabs').click(function() {
    $tabs.tabs({disabled: false});
});

Пример: http://jsfiddle.net/william/ysjVU/2/

У вас также может быть какое-то событие для повторного отключения вкладки.

0 голосов
/ 21 августа 2011

Почему бы вам просто не отключить другие вкладки, пока они не завершат форму.

Сначала отключите все, кроме вкладки 1. Затем, когда они закончили заполнять форму на вкладке 1, включите вторую вкладку и выберите ее для них. Затем просто повторите это для каждой из вкладок.

...