TabView/AccordionPanel: error indication

When you have a TabView with multiple tabs on which validation can fail, it is really handy that the tabs on which errors occur, get an error highlighting. For this, we use the following Javascript within our project:

function markInvalidTabs(id) {
    id = PrimeFaces.escapeClientId(id);
    let c = $(id + '>ul>li');
    c.each(function () {
        let d = $('a', this);
        let tid = d.attr('href').substring(1);
        tid = PrimeFaces.escapeClientId(tid);
        let uiStateErrorElements = $(tid + ' .ui-state-error');
        let uiMessageErrorDetailElements = $(tid + ' .ui-message-error-detail');
        if (uiStateErrorElements.length + uiMessageErrorDetailElements.length > 0) {
            $(this).addClass('ui-state-error');
        } else {
            $(this).removeClass('ui-state-error');
        }
    });
}

and hence we call this method after an AJAX update, with id the TabView identifier. It would be cool if this would be the default behavior of TabView.

[fcorneli]

@melloware Created ticket #9054 for the focusOnError feature.

[fcorneli]

@melloware Indeed, that’s one of the reasons why I had ui-message-error-detail in the original code. Maybe this could be added again? Won’t hurt I guess…