Вкладки пользовательского интерфейса Jquery, проверка формы

Question

У меня есть форма с вкладками jQuery UI, например:

    <form>
  <div id="tabs"> 
   <ul>
                <li>Link to fragment 1</li>
                <li>Link to fragment 2</li>
                <li>Link to fragment 3</span></a></li>
                <li>Link to fragment 4</li>
                <li>Link to fragment 5</li>
   </ul>

<!-- Form Fields Step 1 -->
<div id="fragment-1" class="ui-tabs-panel"> 
  Tab 1 Form Fields 
</div>          

<!-- Form Fields Step 2 -->
<div id="fragment-2" class="ui-tabs-panel ui-tabs-hide">
  Tab 2 Form Fields 
</div>

<!-- Form Fields Step 3 -->
<div id="fragment-3" class="ui-tabs-panel ui-tabs-hide">
  Tab 3 Form Fields
</div>
 <!-- Form Fields Step 4 -->
<div id="fragment-4" class="ui-tabs-panel ui-tabs-hide">
  Tab 2 Form Fields
</div>
<!-- Form Fields Step 5 -->
<div id="fragment-5" class="ui-tabs-panel ui-tabs-hide">
  Form Summary</div>
</div>
</form>

При отправке я хотел бы получить подтверждение, которое переносит пользователя на конкретную вкладку, где возникает первая ошибка.Любая помощь приветствуется.-К

Answer 1

Ленивый / простой способ состоит в том, чтобы использовать javascript для перехода по вкладке nav для вкладки, содержащей ошибку. Как то так ...

код псевдо:

$('#submit').click(function(){
    [validation here]
    on validate{
        $('input.error').closest('.tab_class').attr('id');
        var tab_num = get the tab number out of the id with substr
        $('#tab_nav_button_'+tab_num).click();   [javascript clicks the tab nav, showing the correct tab]
}

}