Pergunta

Eu tenho um rico: TabPanel com várias abas na mesma. Eu quero usar jQuery para registrar as mudanças em cada guia de modo que quando uma alteração é feita dentro de uma guia que eu mude a imagem do guia em segundo plano.

Parece que este:

<h:form id="form">
    <rich:jQuery selector="#tab1_lbl" query="addClass('testClass')" timing="onload"/>
        <rich:tabPanel switchType="client" id="tabContainer">
            <rich:tab id="tab1" label="tab1" title="tab1" >
                 tab1
            </rich:tab>

            <rich:tab id="tab2" label="tab2">
                 tab2
            </rich:tab>
       </rich:tabPanel>
</h:form>

A razão de eu ter o #tab_lbl selector dizer é porque o HTML gerado a partir desta parecido com este:

<td id="form:tab1_lbl" class="dr-tbpnl-tb rich-tab-header dr-tbpnl-tb-act rich-tab-active " title="tab1" onmouseout="RichFaces.outTab(this);" onmouseover="RichFaces.overTab(this);">
tab1
</td>

Agora eu também tentou especificar o seletor como este selector = "# forma: tab_lbl", mas ainda assim eu posso nunca chegar a adicionar a classe a este elemento td. Existe alguma razão para isso? Se eu fizer uma nova tabela sem usar richfaces TabPanel posso facilmente usar esta forma de adicionar classes com os mesmos seletores, mas trabalho apenas não faça neste exemplo.

Todas as idéias?

Edit:. Eu gostaria de acrescentar que, se eu usar o Firebug e adicionar a classe à mão I obter o resultado Im procurando

Foi útil?

Solução

rich:jQuery vai encontrar o ID adequado para você se ele pode combiná-lo a um componente. Do Richfaces desenvolvedor Guia :

Quando você define um seletor, RichFaces examina o seu conteúdo e tenta Substitua o definido no id seletor com um ID de componente se ele é encontrado.

Também olhar para o exemplo dado para quando você quiser especificar o exata ID:

<rich:jQuery selector="#form\\:menu img" query="..." />

(note o back-barra dupla para escapar do cólon)

Você pode usar #tab1 como seletor e rica: jQuery iria substituí-lo com a identificação correta. No entanto, este iria encontrar o guia e você quer o rótulo guia.

Assim, possivelmente uma forma mais robusta para encontrar o rótulo (robusta no que se você mover sua página ao redor ou dar a forma de um id, então ele irá ainda trabalho) seria encontrar na guia e, em seguida, a criança desse guia que é o rótulo. Então um seletor possível seria:

#tab1/../td.rich-tab-header
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top