<html lang="pt-pt" dir="ltr"><head></head><body>### [Como Definir um Número Mínimo de Caracteres num Campo de Formulário de Texto](https://wpforms.com/developers/how-to-set-a-minimum-number-of-characters-on-a-text-form-field/)

**Publicado:** 24 de fevereiro de 2021
**Autor:** Equipe Editorial

**Resumo:** Este tutorial mostrar-lhe-á como usar JavaScript para definir um número mínimo de caracteres num campo de formulário de texto. 

**Conteúdo:**

## Introdução

Gostaria de definir um número mínimo de caracteres para alguns dos seus campos de formulário? Dentro do construtor de formulários, já pode definir um número máximo para este campo [seguindo esta documentação](https://wpforms.com/docs/how-to-limit-words-or-characters-in-a-form-field/ "Como Limitar Palavras ou Caracteres num Campo de Formulário").

No entanto, usando um pequeno trecho de JavaScript, também pode definir um número mínimo. Isto pode ser bastante útil se desejar definir o seu campo **Palavra-passe** para um número mínimo de caracteres.

Neste tutorial, vamos criar um formulário de exemplo e aplicar este número mínimo de caracteres a um campo de **Texto de Linha Única**, campo **Palavra-passe** e campo de **Texto de Parágrafo**.

## Criação do seu formulário

Vamos começar por criar um novo formulário. Dentro do nosso formulário de exemplo, vamos adicionar os campos **Nome**, **Palavra-passe** e **Biografia (Texto de Parágrafo)**, que terão todos um limite mínimo de caracteres definido.

Se precisar de alguma assistência na criação do seu formulário, [consulte esta documentação](https://wpforms.com/docs/creating-first-form/ "Como Criar o Seu Primeiro Formulário").

![comece por criar o seu formulário e adicionar os seus campos](https://wpforms.com/wp-content/uploads/2022/06/creating-form-wpf-char-limit.jpg)

## Adição das classes CSS

Agora precisamos de adicionar um nome de classe CSS a cada um dos campos aos quais queremos aplicar este limite mínimo de caracteres.

Enquanto estiver no construtor de formulários, selecione o campo que deseja editar. Clicando em **Opções do Campo** e depois em **Avançado**, podemos adicionar a nossa classe CSS em **Classes CSS**. A classe que adicionará é **wpf-char-min**.

![Adicione o Nome da Classe aos campos aos quais deseja adicionar um comprimento mínimo de caracteres](https://wpforms.com/wp-content/uploads/2022/06/wpforms-add-css-classname-min-chars.jpg)

Ao adicionar esta classe CSS, estamos a dar ao JavaScript um sinal para procurar, para que ele só execute o script nos campos com esta classe CSS.

Repita este passo para cada campo de formulário para o qual deseja exigir uma quantidade mínima de caracteres. Para este exemplo, adicionámos a classe CSS apenas aos campos de formulário **ID de Utilizador**, **Palavra-passe** e **Biografia**.

## Adição do JavaScript

E finalmente, para concluir a funcionalidade, precisamos de adicionar um pequeno trecho de código JavaScript ao nosso site.

Se precisar de ajuda para adicionar trechos de código ao seu site, [reveja este tutorial.](https://wpforms.com/developers/how-to-add-custom-php-or-javascript-for-wpforms/ "Como Adicionar PHP ou JavaScript Personalizado para WPForms")

No nosso exemplo abaixo, estamos a exigir um mínimo de **8** caracteres para o **ID de Utilizador** e **Palavra-passe**, mas a aumentar o mínimo para **25** para o campo **Biografia**.

Por favor, lembre-se que se estiver a usar uma **[Máscara de Entrada](https://wpforms.com/docs/how-to-use-custom-input-masks/ "Como Usar Máscaras de Entrada Personalizadas no WPForms")** no campo, este trecho de código não funcionará.

```

/**
 * Definir número mínimo de caracteres
 *
 * @link https://wpforms.com/developers/how-to-set-a-minimum-number-of-characters-on-a-text-form-field/
 */

function wpf_dev_char_min() {
    ?&gt;

**Categorias:** Tutoriais

**Etiquetas:** Javascript, JS

---</body></html>