AEM 6.4 chegou ao fim do suporte estendido e esta documentação não é mais atualizada. Para obter mais detalhes, consulte nossa períodos de assistência técnica. Encontre as versões compatíveis here.
Forms (formulários adaptáveis e formulários HTML5) use jQuery, Backbone.js e Underscore.js bibliotecas para aparência e scripts. Os formulários também usam o Interface do usuário do jQuery Widgets arquitetura para todos os elementos interativos (como campos e botões) no formulário. Essa arquitetura permite que o desenvolvedor do Form use um conjunto avançado de widgets e plug-ins jQuery disponíveis no Forms. Você também pode implementar uma lógica específica do formulário enquanto captura dados de usuários como restrições de leadDigits/trailDigits ou implementando cláusulas de imagem. Os desenvolvedores de formulários podem criar e usar experiências personalizadas para melhorar a experiência de captura de dados e torná-la mais fácil de usar.
Este artigo é para desenvolvedores com conhecimento suficiente de widgets jQuery e jQuery. Ele fornece informações sobre a estrutura de aparência e permite que os desenvolvedores criem uma aparência alternativa para um campo de formulário.
A estrutura de aparência depende de várias opções, eventos (acionadores) e funções para capturar as interações do usuário com o formulário e responde às alterações no modelo para informar o usuário final. Além disso:
Veja a seguir as opções globais definidas. Essas opções estão disponíveis para cada campo.
Propriedade | Descrição |
---|---|
name | Um identificador usado para especificar esse objeto ou evento em expressões de script. Por exemplo, essa propriedade especifica o nome do aplicativo host. |
valor | Valor real do campo. |
displayValue | Esse valor do campo é exibido. |
screenReaderText | Os Reader de tela usam esse valor para narrar informações sobre o campo. O formulário fornece o valor e você pode substituir o valor . |
tabIndex | A posição do campo na sequência de tabulação do formulário. Substitua tabIndex somente se desejar alterar a ordem de tabulação padrão do formulário. |
função | Função do elemento, por exemplo, Cabeçalho ou Tabela. |
altura | A altura do widget. É especificado em pixels. |
largura | A largura do widget. É especificado em pixels. |
access | Controles usados para acessar o conteúdo de um objeto de contêiner, como um subformulário. |
paraStyles | A propriedade para de um elemento XFA para o widget. |
dir | A direção do texto. Os valores possíveis são ltr (esquerda para a direita) e rtl (direita para a esquerda). |
Além dessas opções, a estrutura fornece outras opções que variam de acordo com o tipo de campo. Os detalhes das opções específicas de campos são listados abaixo.
Para interagir com a estrutura de formulários, um widget aciona alguns eventos para permitir que o script de formulário funcione. Se o widget não lançar esses eventos, alguns dos scripts escritos no formulário para esse campo não funcionarão.
Evento | Descrição |
---|---|
XFA_ENTER_EVENT | Esse evento é acionado sempre que o campo está em foco. Ele permite que o script "enter" seja executado no campo. A sintaxe para acionar o evento é (widget)._trigger(xfalib.ut.XfaUtil.prototype.XFA_ENTER_EVENT) |
XFA_EXIT_EVENT | Esse evento é acionado sempre que o usuário deixa o campo . Ele permite que o mecanismo defina o valor do campo e execute seu script de "saída". A sintaxe para acionar o evento é (widget)._trigger(xfalib.ut.XfaUtil.prototype.XFA_EXIT_EVENT) |
XFA_CHANGE_EVENT | Esse evento é acionado para permitir que o mecanismo execute o script "change" gravado no campo. A sintaxe para acionar o evento é (widget)._trigger(xfalib.ut.XfaUtil.prototype.XFA_CHANGE_EVENT) |
XFA_CLICK_EVENT | Esse evento é acionado ao clicar no campo. permite que o mecanismo execute o script "click" gravado no campo. A sintaxe para acionar o evento é (widget)._trigger(xfalib.ut.XfaUtil.prototype.XFA_CLICK_EVENT) |
A estrutura de aparência chama algumas funções do widget que são implementadas nos widgets personalizados. O widget deve implementar as seguintes funções:
Função | Descrição |
---|---|
foco: function() | Coloca o foco no campo. |
clique em: function() | Coloca foco no campo e chama XFA_CLICK_EVENT. |
markError:function(errorMessage, errorType) Observação: Aplicável apenas para formulários HTML5. |
Envia mensagem de erro e tipo de erro para o widget. O widget exibe o erro. |
clearError: function() Observação: Aplicável apenas para formulários HTML5. |
Chamado se os erros no campo forem corrigidos. O widget oculta o erro. |
Todos os widgets personalizados devem estar em conformidade com as especificações acima. Para usar os recursos de diferentes campos, o widget deve estar em conformidade com as diretrizes desse campo específico.
Opção | Descrição |
---|---|
multiline | True se o campo suporta a inserção de um caractere de nova linha, caso contrário false. |
maxChars | Número máximo de caracteres que podem ser inseridos no campo. |
limitLengthToVisibleArea Observação: Aplicável apenas aos formulários HTML5 |
Especifica o comportamento do campo de texto quando a largura do texto excede a largura do widget. |
Opção | Descrição |
---|---|
valor |
Matriz de valores selecionados. |
itens |
Matriz de objetos a serem exibidos como opções. Cada objeto contém duas propriedades - salvar: valor a ser salvo, exibir: valor a ser exibido. |
editável Observação: Aplicável apenas para formulários HTML5. |
Se o valor for true, a entrada de texto personalizada será ativada no widget. |
displayValue |
Matriz de valores a serem exibidos. |
multisseleção |
True se várias seleções forem permitidas, caso contrário false. |
Função | Descrição |
---|---|
addItem: function(itemValues) |
Adiciona um item à lista. |
deleteItem: function(nIndex) nÍndice: índice do item a ser removido da lista |
Exclui uma opção da lista. |
clearItems: function() |
Apaga todas as opções da lista. |
Opções | Descrição |
---|---|
dataType | Sequência de caracteres que representa o tipo de dados do campo (inteiro/decimal). |
leadDigits | Dígitos máximos à esquerda permitidos no número decimal. |
fracDigits | Dígitos da fração máxima permitidos no número decimal. |
zero | Representação de string de zero na localidade do campo. |
decimal | Representação de string do decimal na localidade do campo. |
Opções | Descrição |
---|---|
values | Matriz de valores (ativado/desativado/neutro). É uma matriz de valores para os diferentes estados do checkButton. values[0] é o valor quando o estado está ATIVADO, values[1] é o valor quando o estado está desativado, |
states | Número de estados permitidos. Dois para formulários adaptáveis (Ligado, Desligado) e três para formulários HTML5 (Ligado, Desligado, Neutro). |
estado | Estado atual do elemento. Dois para formulários adaptáveis (Ligado, Desligado) e três para formulários HTML5 (Ligado, Desligado, Neutro). |
Opção | Descrição |
---|---|
dias | Nome localizado de dias para esse campo. |
meses | Nomes de mês localizados para esse campo. |
zero | O texto localizado para o número 0. |
clearText | O texto localizado para o botão limpar. |