Как выбрать вкладки jquery, если отображается errorLable

Question

я собираюсь применить вкладки jquery UI к моему приложению, и я собираюсь применить к нему класс проверки jquery. моя проблема в том, что если я получил ошибку в каком-то div, следует выбрать div и показать ошибку пользователю при нажатии на кнопку сохранения.

я пытался

 $('#tabs > div').each(function(i){
                   if($('.errortd', this).not(':hidden').length>0){
                                $("#tabs").tabs('select', i);                                              

                      });

               });

Но мне не везет, спасибо, спасибо

мои вкладки div

    <div id="tabs">
           <ul>
            <li><a href="#editEmployeeDIV"><?php echo __("View/Edit employees") ?></a></li>
            <li><a href="#addEmployeeDIV"><?php echo __("Assign new employees") ?></a></li>
           </ul>
    <div id="editEmployeeDIV">
    </div>
    <div id="editEmployeeDIV">
    </div> 
</div>

мои метки ошибок, имеющие класс errortd

<label for="txtAmount_146" generated="true" class="errortd" style="display: none; ">This field is required.</label>

Answer 1

У вас есть несколько проблем.

Первый - это блуждающий ); в вашем коде:

if($('.errortd', this).not(':hidden').length>0){
    $("#tabs").tabs('select', i);                                              
}); // <------ Right here

Тогда вы используете :hidden, когда вы не должны быть. Из прекрасного руководства :

Элементы могут считаться скрытыми по нескольким причинам:
[...]

• Элемент-предок скрыт, поэтому элемент не отображается на странице.

Это означает, что <label> всегда будет считаться скрытым, если он находится на нетоковой вкладке.

Вы могли бы сделать что-то вроде этого:

var $shown = $(this).find('.errortd').filter(function() {
    var dpy = $(this).css('display');
    return !dpy || dpy != 'none';
});
if($shown.length > 0)
    $("#tabs").tabs('select', i);

Демо: http://jsfiddle.net/ambiguous/agrCe/

Или добавьте класс к элементам <label>, который скрывает их, а не скрывает их вручную. У вас есть немного CSS, как это:

.no-error {
    display: none;
}

А потом:

if($(this).find('.errortd:not(.no-error)').length > 0)
    $("#tabs").tabs('select', i);

Демо: http://jsfiddle.net/ambiguous/Z4D2A/