Verificação HTML: O atributo "required" só é permitido quando o tipo de input é "checkbox", "date", "datetime-local", "email", "file", "month", "number", "password", "radio", "search", "tel", "text", "time", "url", ou "week".

Sobre este problema HTML

O atributo required é um atributo booleano que informa o navegador de que um campo deve ser preenchido antes de o formulário poder ser submetido. No entanto, nem todos os tipos de input suportam este conceito. Alguns tipos de input têm sempre um valor (como range, que tem como padrão um ponto médio, ou color, que tem como padrão #000000), enquanto outros representam ações em vez de dados do utilizador (como submit, reset, image, e button). Para inputs hidden, o utilizador não tem forma alguma de interagir com o campo, pelo que exigir que forneçam um valor não faz sentido.

A especificação HTML limita explicitamente o required aos seguintes tipos de input: checkbox, date, datetime-local, email, file, month, number, password, radio, search, tel, text, time, url, e week.

Usar required num tipo não suportado é HTML inválido. Os navegadores normalmente ignoram o atributo nesta situação, o que significa que pode acreditar que um campo é obrigatório quando na verdade não está a ser validado de todo. Isto pode levar a formulários sendo submetidos com dados em falta ou inesperados. Também cria confusão para tecnologias assistivas — os leitores de ecrã podem anunciar um campo como obrigatório mesmo que o navegador não o aplique, enganando os utilizadores.

Como corrigir

Verifique o tipo de input. Se estiver a usar required num input com um tipo como hidden, range, color, submit, reset, image, ou button, o atributo não é permitido.
Remova o atributo required se o tipo de input inerentemente fornece um valor ou não aceita dados fornecidos pelo utilizador.
Altere o tipo de input se realmente precisar que o campo seja obrigatório e o tipo atual não corresponder à sua intenção.
Use validação do lado do servidor para inputs como hidden que não podem usar required mas ainda precisam de um valor.

Exemplos

❌ Inválido: `required` num input hidden

<form>
  <input type="hidden" name="token" required>
  <button type="submit">Submit</button>
</form>

O utilizador não pode interagir com um input hidden, pelo que required não é permitido aqui. O navegador não o aplicará.

❌ Inválido: `required` num input range

<form>
  <label for="volume">Volume:</label>
  <input type="range" id="volume" name="volume" min="0" max="100" required>
  <button type="submit">Submit</button>
</form>

Um input range tem sempre um valor (tem como padrão o ponto médio), pelo que required é sem significado e não permitido.

❌ Inválido: `required` num input color

<form>
  <label for="color">Pick a color:</label>
  <input type="color" id="color" name="color" required>
  <button type="submit">Submit</button>
</form>

Um input color tem sempre um valor (com padrão #000000), pelo que required não é válido aqui.

✅ Válido: `required` removido de tipos não suportados

<form>
  <input type="hidden" name="token" value="abc123">
  <label for="volume">Volume:</label>
  <input type="range" id="volume" name="volume" min="0" max="100">
  <button type="submit">Submit</button>
</form>

✅ Válido: `required` em tipos de input suportados

<form>
  <label for="email">Email:</label>
  <input type="email" id="email" name="email" required>

  <label for="dob">Date of birth:</label>
  <input type="date" id="dob" name="dob" required>

  <label>
    <input type="checkbox" name="terms" required>
    I agree to the terms
  </label>

  <button type="submit">Submit</button>
</form>

Estes tipos de input — email, date, e checkbox — todos aceitam entrada direta do utilizador e estão na lista permitida para o atributo required.