Alternar classe
Alterna, a cada vez que é chamado (inserindo ou removendo), uma classe CSS que foi configurada em um componente (elemento) do formulário.
Parâmetros
Nome | Tipo | Doc |
|---|---|---|
| Parâmetro 1 | Objeto | Identificador do componente a ter sua a classe CSS alternada. |
| Parâmetro 2 | Texto | Recebe o nome da classe sem o símbolo de ponto no começo do nome. Exemplo: |
Compatibilidade
Servidor
Cliente
Exemplo
Após vincular um formulário de referência nas configurações do bloco, a função "AlternandoClasse" (Figura 1) recebe o bloco Alternar classe e seus parâmetros estão configurados da seguinte forma:
- Obter identificador: nome da propriedade Identificador do componente que será utilizado;
- Valor do atributo: Classe CSS que será definida inserida ou removida do componente (Sem o ponto antes do nome da classe).
Figura 1 - Bloco Definir visibilidade
A função acima é atribuída ao evento Ao Clicar do botão "Alternar Classe" (Figura 1.1) na aplicação. O componente Entrada de texto alternará a cada clique, inserindo ou retirando a classe do componente. Nesse exemplo, a classe "style6070" muda a cor de fundo do componente (Figura 1.1).
Figura 1.1 - Alternando Classe CSS
Abaixo, segue o estilo CSS que foi utilizado no exemplo, ele pode ser configurado na aba Estilo, para mais detalhe acesse a documentação sobre Estilo - CSS.
Figura 1.2 - Estilo CSS utilizado
Vincular formulário
Para selecionar o Identificador (id) do componente no parâmetro Obter identificador, é necessário apontar a view desejada no campo Formulário de referência das configurações do Editor de Bloco de programação.
Mais sobre o bloco
É possível utilizar qualquer classe criada pelo usuário em app.css (visível com o Modo avançado ativado) (Endereço: src/main/webapp/css/app.css) ou as classes que são carregadas junto com a página.
Quando acrescentamos uma classe CSS em um componente, ela é incluída no atributo class do elemento, porém, lá já podem existir outras classes anteriores a ela tendo maior prioridade, se nessas classes houver algo que altere a mesma propriedade CSS que você inseriu. A classe com maior prioridade irá sobrepor as demais se os atributos alterados forem os mesmos, portanto, pode ser que não ocorra alterações devido à alguma prioridade maior de outras classes.