Atributos usados em formulários

Vamos falar nesse post sobre os atributos usados nos formulários e entender melhor sobre eles.

Entenda um pouco mais sobre as entradas dos atributos em campos dos formulários.

ATRIBUTOS TIPOS DE ENTRADA

<input type="tipodeentrada" />

Os atributos DO tipo ( type ) permitem que você selecione diferentes tipos de entradas.

ATRIBUTOS NOMES DE ENTRADA

<input name="nomedeentrada" />

O atributo de nome rotula os dados quando é enviado para o servidor

ATRIBUTOS FOR DO LABEL

<label for="nomedoid"></label>

O atributo ( for ) permite que você vincule uma etiqueta com uma entrada. Você associa ele com o atributo ( id ) do campo em questão.

ATRIBUTOS DE VALOR

<input type="text" value="valorpadrao" />
     
<input type="checkbox" value="valoropcao" />
     
<option value="valoropcao">
       
<input type="submit" value="textodobotao" />

O atributo de valor pode ser usado para definir um valor padrão para um campo de entrada, definir valores para botões de opção, caixa de seleção, elementos de opção e definir texto de exibição de um botão.

ATRIBUTOS SELECIONADOS OU CHECADOS

<input type="checkbox" checked />
 
<input type="radio" checked />
 
<select>
  <option value="item1">Item 1</option>
  <option value="item2" selected>Item 2</option>
  <option value="item3">Item 3</option>
</select>

O atributo de verificação define qual botão de opção ou caixa de seleção já está marcado quando o formulário é exibido, ou seja, ao entrar numa página com formulário alguns campos por padrão já estão selecionados ou marcados.

Isso acontece porque os campos já vem com os atributos ( checked ) e ( selected ) incluídos no HTML ou incluído via jQuery ao carregar a página.

ATRIBUTOS DE POSIÇÃO

<input placeholder="Sugestão de texto" />

O atributo de posição ( placeholder ) é usado para fornecer textos dentro de um campo de formulário indicando o que o usuário deve fazer.

ATRIBUTOS DE NÚMEROS

<input type="number" min="valor" max="valor" step="valor" />

Os atributos ( min ) e ( max ) são usados para especificar o valor que deve ser aceito em uma entrada.

O atributo ( step ) é usado para definir os incrementos que serão aceitos em uma entrada.

ATRIBUTOS DE COMPRIMENTO MÁXIMO

<input type="text" maxlength="valor" />

O atributo DE comprimento máximo ( maxlength ) define o número máximo de caracteres que serão aceitos em um campo.

ATRIBUTOS MULTIPLOS

<input type="email" multiple />

O atributo múltiplo ( multiple ) permite ao usuário inserir vários valores nesse campo separando por vírgulas ( , ).

ATRIBUTOS DE PADRONIZAÇÃO
<input type="text" pattern="[A-Za-z]{4}" />

O atributo ( pattern ) é usado para definir o requisito para os caracteres exatos que podem ser inseridos em um campo.

Acima definimos que o campo só vai ser enviado se conter 4 letras alfabéticas, aceita maiúsculas e minusculas.

ATRIBUTOS REQUERIDOS

<input type="text" required aria-required="true" />

O atributo ( required ) informa ao navegador que o campo deve ser preenchido antes que o formulário possa ser enviado.

O atributo ( aria-required ) é usado para dizer aos leitores de tela que um campo é necessário, se eles não suportam o atributo requerido.

ATRIBUTOS DE DESATIVAÇÃO

<input type="text" disabled />

O atributo ( disabled ) significa que nenhum dado pode ser inserido e também os dados não serão enviados.

Por isso tenha cautela ao user esse atributo.

ATRIBUTOS SOMENTE LEITURA

<input type="url" readonly value="valor" />

O atributo somente leitura ( readonly ) em um campo, significa que nenhum dado pode ser inserido, mas o valor previamente definido será enviado.

Artigos Relacionados