Guia abrangente para atributos de entrada de formulário HTML
Os atributos ou propriedades de entrada do formulário HTML estão em discussão. Para o elemento HTML <input> , as várias propriedades de formulário* são abordadas neste artigo.
Atributos de entrada do formulário HTML
Os atributos de entrada do formulário HTML são propriedades especiais que podem ser adicionadas a um elemento <input> para definir várias características e comportamentos do campo de entrada.
Esses atributos incluem “ Formaction ”, “ Formenctype ”, “ Formmethod ”, “ Formnovalidate ”, “ Novalidate ” e alguns outros. Cada atributo tem uma finalidade específica e pode ser usado para personalizar o comportamento do campo de entrada de diferentes maneiras.
Por exemplo, o atributo “ Formaction ” é útil nos casos em que você deseja enviar os dados do formulário para uma URL diferente da padrão, enquanto o atributo “ Formenctype ” é usado para especificar o tipo de codificação dos dados do formulário quando o formulário é enviado para o servidor.
Atributo do formulário
A propriedade input <form> define o formulário ao qual o elemento <input> pertence.
O valor desta propriedade deve ser igual ao atributo id do elemento <form> ao qual pertence.
Veja a seguir um exemplo de atributos de formulário HTML .
Um campo de formulário HTML que não está realmente dentro do próprio formulário:
Example
Atributo de formação HTML
O atributo de formação HTML é um atributo especial que pode ser adicionado a um botão de envio ou a um elemento de entrada com o tipo “ enviar ” dentro de um formulário.
Este atributo especifica a URL do script do lado do servidor ou da página da Web que processará os dados do formulário quando o formulário for enviado.
Por padrão, o atributo action do formulário especifica a URL para onde os dados do formulário são enviados quando o formulário é enviado. No entanto, ao adicionar o atributo de formação a um botão de envio ou a um elemento de entrada com o tipo “enviar”, você pode substituir o atributo padrão “ação” desse botão ou elemento de entrada específico.
Isso pode ser útil nos casos em que você deseja enviar os dados do formulário para um URL diferente do padrão ou se deseja fornecer várias opções para enviar os dados do formulário para diferentes terminais.
Os tipos de entrada de envio e imagem são suportados por meio da propriedade de formação .
Exemplo de atributos de formulário HTML mostrados abaixo.
Um botão de envio de formulário HTML com dois comportamentos distintos:
Example
Outro exemplo do atributo de ação do formulário é dado abaixo:
Example:
Atributo Formenctype
O atributo HTML formenctype é usado para especificar o tipo de codificação dos dados do formulário quando o formulário é enviado ao servidor.
Esse atributo normalmente é usado em conjunto com o atributo method , que especifica o método HTTP usado para enviar os dados do formulário.
O atributo formenctype Html pode ter um dos três valores possíveis:
| valores formenctype | Visão geral |
| application/x-www-form-urlencoded | É um tipo de codificação padrão e é usado para enviar dados de formulário simples, como texto ou valores numéricos. Esse tipo de codificação também é o mais eficiente e é amplamente suportado por navegadores e servidores da web. |
| multipart/form-data | Isso é usado para enviar dados binários ou de arquivo, como imagens ou arquivos de áudio, bem como dados de texto. Esse tipo de codificação é normalmente usado em formulários de upload de arquivo. |
| texto/simples | Isso raramente é usado e é adequado apenas para enviar dados de texto sem formatação sem nenhum caractere ou formatação especial. |
O atributo acima substitui o atributo enctype do elemento <form> .
Veja a seguir um exemplo de atributos de formulário HTML :
Um formulário com dois botões para envio.
O primeiro transmite os dados do formulário em sua codificação normal, enquanto o segundo os entrega codificado como “ multipart/form-data ”:
Example
O atributo form enctype outro exemplo:
Example:
Atributo de método de formulário
O atributo HTML formmethod é usado para especificar o método HTTP usado para enviar os dados do formulário quando o formulário é enviado. O atributo normalmente é usado em conjunto com o atributo action , que especifica a URL onde os dados do formulário são enviados.
O atributo formmethod pode assumir um dos dois valores possíveis: get ou post .
| Valores de método de formulário | Visão geral |
| Pegar | Este método envia os dados do formulário como parte da string de consulta da URL, que pode ser vista na barra de endereços do navegador. Esse método é útil para enviar dados de formulário simples, como consultas de pesquisa, e pode ser marcado ou compartilhado facilmente. |
| Publicar | Este método envia os dados do formulário como parte do corpo da solicitação HTTP, que não é visível na barra de endereços. Esse método é mais seguro e normalmente é usado para enviar dados de formulários confidenciais ou complexos, como credenciais de login ou arquivos grandes. |
O atributo de método de um elemento <form> é substituído por este atributo.
Os tipos de entrada de envio e imagem são suportados pelo atributo formmethod quando se trata de atributos de entrada de formulário HTML.
Uma visão geral do método GET:
- Os pares de nome/valor são anexados ao URL usando este método
- Quando um usuário deseja marcar os resultados de um envio de formulário, o método Get pode ser útil.
- Na maioria dos navegadores, você só pode colocar uma certa quantidade de dados em um URL, portanto, não pode garantir que todos os dados do formulário sejam transferidos corretamente
- Não transmita informações confidenciais por meio do método Get ! Será possível ver senhas ou outras informações confidenciais na barra de endereços do navegador.
Uma visão geral do método POST é a seguinte:
- Os dados do formulário são enviados via transação HTTP post com o método Post
- Não é possível marcar envios de formulários feitos usando o método Post
- Comparado ao Get, o método Post é mais eficiente e seguro e não tem limite no tamanho dos dados
Um exemplo de atributo de formulário HTML é mostrado abaixo:
Dois botões de envio estão presentes neste formulário. Método= GET é usado para enviar os dados do formulário e segundo método= POST envia os dados do formulário:
Example
Outro exemplo do atributo formmethod :
Example:
Atributo Formtarget
O atributo HTML formtarget é usado para especificar a janela ou quadro de destino em que a resposta do servidor ao envio do formulário será exibida.
O atributo formtarget pode assumir um dos vários valores possíveis:
| Valores de meta de formulário | Visão geral |
| _auto | É ( padrão ) e faz com que a resposta do servidor seja exibida no mesmo quadro ou janela do formulário. |
| _em branco | Isso faz com que a resposta do servidor seja exibida em uma nova janela ou guia sem nome. |
| _pai | Ele faz com que a resposta do servidor seja exibida no quadro pai do quadro ou janela atual. |
| _principal | Ele faz com que a resposta do servidor seja exibida no contexto de navegação de nível superior. |
Você também pode usar um quadro ou janela nomeado como o valor do atributo formtarget, o que faz com que a resposta do servidor seja exibida nesse quadro ou janela nomeado.
Envios e imagens são suportados pelo atributo formtarget nos atributos de entrada do formulário HTML.
Um exemplo de atributo de formulário HTML é mostrado abaixo.
Existem dois botões de envio neste formulário, mas as janelas de destino não são as mesmas:
Example
Atributo Form Target outro exemplo é dado abaixo:
Example:
Atributo Formnovalidate
O atributo HTML formnovalidate é usado para desabilitar a validação de formulário do lado do cliente quando o formulário é enviado. Por padrão, quando um formulário é enviado, o script do lado do cliente valida os dados do formulário para garantir que sejam válidos e completos antes de enviá-los ao servidor.
Caso algum erro seja encontrado, o script impede o envio do formulário e exibe mensagens de erro ao usuário.
No entanto, adicionando o atributo formnovalidate ao botão de envio ou elemento de entrada com o tipo submit , você pode desabilitar a validação de formulário do lado do cliente para esse botão ou elemento de entrada específico.
Isso pode ser útil nos casos em que você deseja enviar os dados do formulário sem executar a validação, como quando deseja permitir que o usuário envie dados de formulário incompletos ou inválidos.
Existem dois botões de envio no formulário um com validação e outro sem validação:
Example
Atributo Novalidado
O atributo novalidate HTML é usado para desabilitar a validação de formulário do lado do cliente para um formulário inteiro.
Por padrão, quando um formulário é enviado, o script do lado do cliente valida os dados do formulário para garantir que sejam válidos e completos antes de enviá-los ao servidor.
Caso algum erro seja encontrado, o script impede o envio do formulário e exibe mensagens de erro ao usuário.
Isso pode ser útil nos casos em que você deseja permitir que o usuário envie dados de formulário incompletos ou inválidos ou se deseja manipular a validação do formulário inteiramente no lado do servidor.
Como um exemplo de atributos de entrada de formulário HTML, aqui está sua aparência.
Ao enviar o formulário, nenhuma validação deve ocorrer:
Example
Aqui está um exemplo de atributo novalidate de formulário com atributo de destino de formulário para melhor compreensão:
Example:
Conclusão
Os atributos de entrada de formulário HTML são um componente vital do desenvolvimento da Web, e o HTML fornece vários atributos que permitem personalizar a funcionalidade e o comportamento. Compreender esses atributos, incluindo formaction, formenctype, formmethod, formtarget, formnovalidate e novalidate, é essencial para criar formulários da web eficazes e fáceis de usar.
Aproveitando esses atributos, você pode criar formulários da Web dinâmicos e responsivos que fornecem uma ótima experiência ao usuário.
Você também pode garantir que os dados do formulário sejam enviados com segurança, validados corretamente e exibidos na janela ou quadro de destino apropriado.
Visite nossa referência de tags HTML para ver uma lista completa de todas as tags HTML disponíveis para você.
