# Restrições de digitação em campo do tipo TextBox

**URL:** <https://community.latromi.com.br/t/restricoes-de-digitacao-em-campo-do-tipo-textbox/836>\
**Category:** Ajuda & Suporte\
**Tags:** javascript, form\
**Created:** [Julho 8, 2022, 5:18pm UTC](https://community.latromi.com.br/t/restricoes-de-digitacao-em-campo-do-tipo-textbox/836 "2022-07-08T17:18:05Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![amendes](https://community.latromi.com.br/letter_avatar_proxy/v4/letter/a/a4c791/32.png) [@amendes](https://community.latromi.com.br/u/amendes)\
**Post date:** [Julho 8, 2022, 5:18pm UTC](https://community.latromi.com.br/t/restricoes-de-digitacao-em-campo-do-tipo-textbox/836/1 "2022-07-08T17:18:05Z")

</div>

Em um campo do tipo TextBox, com o **multilinha** ativado, que irá receber somente texto (como se fosse um memo), em tempo de execução ter os seguintes controles:

- Só aceitar maiúsculas ( eu vi que na propriedade do campo tem, mas para a minha necessidade irá depender de um parâmetro externo para habilitar ou não);
- Não permitir mais de um espaço entre as palavras;
- Não aceitar caracteres especiais.

Para as três necessidades irá depender de um parâmetro externo para habilitar ou não.

É possível ou tem algum material para que eu possa me basear?

Desde já agradeço!

---

<div class="post-metadata">

**Author:** ![daniel.giacomelli](https://community.latromi.com.br/user_avatar/community.latromi.com.br/daniel.giacomelli/32/1476_2.png) [@daniel.giacomelli](https://community.latromi.com.br/u/daniel.giacomelli)\
**Post date:** [Julho 8, 2022, 5:36pm UTC](https://community.latromi.com.br/t/restricoes-de-digitacao-em-campo-do-tipo-textbox/836/2 "2022-07-08T17:36:56Z")

</div>

Olá @amendes!

Seja bem vindo à comunidade!

É possível implementar uma solução envolvendo **Javascript** no Formulário.

No exemplo que vou apresentar a seguir, tenho um Formulário com seguinte estrutura.

- Uma campo do tipo TextBox chamado “CampoTexto” que está configurado com Multilinha

- Três variáveis do tipo Numérica que podem receber os valores `0` (não) ou `1` (sim):

Com a estrutura a cima estabelecida, adicionei um arquivo na seção “Arquivos Javascript” do Formulário, contendo o seguinte código:

```javascript
(function () {

    // Essa função é executada assim logo após a criação do Form
    function onFormCreated(args) {

        // Busca as configurações das variáveis chamadas "allowLowerCase", "allowMultipleSpaces", "allowDiacritics"
        var options = {
            allowLowerCase: args.form.getVariableValue('allowLowerCase') != 0,
            allowMultipleSpaces: args.form.getVariableValue('allowMultipleSpaces') != 0,
            allowDiacritics: args.form.getVariableValue('allowDiacritics') != 0
        }

        // Procura o elemento "textarea" do campo do tipo TextBox chamado "CampoTexto"
        var input = document.querySelector('#' + args.form.fields['CampoTexto'].wrapperClientId + ' textarea');
        // Configura o elemento textarea
        if (input) configureInputBehaviour(input, options);
    }

    // Essa função faz a configuração dos de um campo
    function configureInputBehaviour(input, options) {
        if (options == undefined || options == null)
            throw 'Nenhuma opcao foi definida';

        if (options.allowLowerCase === false) input.setAttribute('data-lowercase', 'deny');
        if (options.allowMultipleSpaces === false) input.setAttribute('data-multiplespaces', 'deny');
        if (options.allowDiacritics === false) input.setAttribute('data-diacritics', 'deny');

        // Primeiro remove o listener (caso esteja reconfigurando um campo)
        //input.removeEventListener('keyup', onTextChanged);
        input.removeEventListener('change', onTextChanged);

        // Adiciona os listeners
        input.addEventListener('change', onTextChanged);
    }

    function onTextChanged(ev) {

        // Obtem as configuracoes do campo dos atributos do elemento
        var options = {
            allowLowerCase: ev.currentTarget.getAttribute('data-lowercase') !== 'deny',
            allowMultipleSpaces: ev.currentTarget.getAttribute('data-multiplespaces') !== 'deny',
            allowDiacritics: ev.currentTarget.getAttribute('data-diacritics') !== 'deny'
        };

        // Se nenhum restricao foi definida, pode sair
        if (options.allowLowerCase && options.allowMultipleSpaces && options.allowDiacritics)
            return;

        // Remove o listener do evento para evitar que entre Loop ao substituir o texto
        ev.currentTarget.removeEventListener('change', onTextChanged);

        var text = ev.currentTarget.value;
        var textPosition = ev.currentTarget.selectionStart;

        // Converte para maiusculo
        if (!options.allowLowerCase)
            text = text.toUpperCase();

        // Percorre cada uma das linhas do texto para remover os espaços duplicados
        // e caracteres especiais, preservando as quebras de linha
        if (!options.allowMultipleSpaces || !options.allowDiacritics) {
            var textLines = text.split('\n');

            for (var n = 0; n < textLines.length; n++) {
                // Substitui mais de um espaço por apenas um
                if (!options.allowMultipleSpaces)
                    textLines[n] = textLines[n].replace(/\s{2,}/g, ' ');

                // Remove acentos: https://stackoverflow.com/questions/990904/remove-accents-diacritics-in-a-string-in-javascript
                if (!options.allowDiacritics)
                    textLines[n] = textLines[n].normalize('NFD').replace(/\p{Diacritic}/gu, '');
            }
            text = textLines.join('\r\n');
        }

        // Ajusta posição do cursor, evitando que fique maior que o tamanho do texto.
        textPosition = Math.min(textPosition, text.length);

        // Passa o texto processado e a posição do cursor para o campo
        ev.currentTarget.value = text;
        ev.currentTarget.selectionStart = textPosition;
        ev.currentTarget.selectionEnd = textPosition;

        // Adiciona o listener do evento
        ev.currentTarget.addEventListener('change', onTextChanged);
    }

    // Adiciona Callbacks no Formulário
    latromi.formManager.setOnFormCreatedCallback(onFormCreated);

})();

```

Este código substitui os caracteres (conforme a configuração) quando o evento **change** for disparado, que no caso do preenchimento pelo usuário, seria logo após o campo perder o foco.

Por fim, basta preencher as variáveis no evento **Load** do Formulário com valores `0` ou `1`.
