Data#
Para configurar o widget, é necessário realizar as seguintes ações:
O widget Data exibe um campo para entrada de data pelo Usuário, permitindo o uso de dicas e restrições para a inserção apenas de valores corretos.
Para configurar o elemento, clique no ícone de edição .
Uma janela pop-up “Configurações do elemento” será aberta:
Campos para configuração do widget#
Preencha os campos necessários para configurar o widget.
“Obrigatório” – checkbox, preenchido manualmente com o botão esquerdo do mouse. Destina-se a colorir o campo de vermelho, caso o Usuário não tenha preenchido este widget.
“Nome visível” – campo de texto, preenchido manualmente com o teclado. Permite especificar um nome para o widget.
“Nome do Parâmetro na Tarefa (Task)” – campo de texto, preenchido manualmente com o teclado. Neste campo é exibido o texto que corresponde ao valor do Parâmetro da Tarefa selecionada. O Usuário pode alterar esse valor no campo de texto, e após salvar o formulário, o novo valor será gravado no Parâmetro da Tarefa selecionada. Isso significa que ao fazer alterações no campo de texto, o Usuário pode atualizar as informações na Tarefa, bastando apenas inserir um novo valor e salvar as alterações.
“Placeholder” – campo de texto, preenchido manualmente com o teclado. Permite especificar um texto de placeholder que será exibido no campo de entrada até que o usuário comece a inserir um valor.
“Classe” – campo de texto, preenchido manualmente com o teclado. Permite especificar uma classe CSS que será aplicada ao elemento. Isso permite alterar o estilo do widget, por exemplo, cor, tamanho ou fonte.
“Expressão regular (Regexp)” – campo de texto, preenchido manualmente com o teclado. Permite definir uma expressão regular para validação da entrada.
“Dica de erro de validação” – campo de texto, preenchido manualmente com o teclado. Permite especificar um texto que será exibido ao Usuário caso o valor inserido não passe na validação.
“Dica” – campo de texto, preenchido manualmente com o teclado. Permite especificar uma dica adicional que ajudará o usuário a entender o que exatamente deve ser inserido.
“Valor padrão” – campo de texto, preenchido manualmente com o teclado. Permite especificar um valor que será exibido no campo de entrada por padrão.
Exemplo de preenchimento#
| Nome do campo | Valor |
| Checkbox "Obrigatório" | |
| Nome visível | Selecione a data |
| Nome do Parâmetro na Tarefa (Task) | event_date |
| Placeholder | DD.MM.AAAA |
| Classe | input-date |
| Expressão regular (Regexp) | ^(0[1-9]|[12][0-9]|3[01])\.(0[1-9]|1[0-2])\.(\d{4})$ |
| Dica de erro de validação | Por favor, selecione uma data entre 01.01.2023 e 31.12.2023. |
| Dica | Selecione uma data importante para o seu evento. |
| Valor padrão | 2023-06-01 |
Resultado:
Exemplo de seleção de data#
- Seleção de data usando o calendário pop-up. Permite que o Usuário escolha uma data a partir de uma interface gráfica interativa.
O Usuário pode navegar entre meses e anos usando as setas ou listas suspensas para escolher o mês e o ano desejados.
Ao clicar em uma data específica no calendário, o usuário preenche automaticamente o campo de entrada de data com o valor selecionado.
- Seleção de data usando a entrada manual pelo teclado. O Usuário clica no campo de entrada e começa a digitar a data no formato estabelecido.
Ao mover o cursor para fora do campo ou ao tentar enviar o formulário, o sistema verifica se a data inserida corresponde à expressão regular ou às regras estabelecidas.