开发者

How to select jquery tabs if errorLable display

im up to apply jquery UI tabs to my application and im going to apply jquery validation class on that. my problem is if i got error in some div that div should selected and display the error to user when click on the save button .

i tried

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

                      });

               });

But i have no luck any help thanks lot

my tabs 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>

my error lables having class errortd

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


You have a few problems.

The first is a stray ); in your code:

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

Then you're using :hidden when you shouldn't be. From the fine manual:

Elements can be considered hidden for several reasons:
[...]

  • An ancestor element is hidden, so the element is not shown on the page.

That means that the <label> will always be considered hidden if it is in a non-current tab.

You could do something like this:

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

Demo: http://jsfiddle.net/ambiguous/agrCe/

Or, add a class to the <label> elements that hides them instead of manually hiding them. You have a bit of CSS like this:

.no-error {
    display: none;
}

And then:

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

Demo: http://jsfiddle.net/ambiguous/Z4D2A/

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜