aboutsummaryrefslogtreecommitdiff
path: root/files/pt-br/web/api/validitystate/index.html
blob: e5bba7b7fbaeb0075991fa80463a6d1f3ae3cb35 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
---
title: ValidityState
slug: Web/API/ValidityState
tags:
  - API
  - Forms
  - HTML DOM
  - HTML5
  - Interface
  - Validation
translation_of: Web/API/ValidityState
---
<div>{{APIRef("HTML DOM")}} {{gecko_minversion_header("2.0")}}</div>

<p>A interface <strong><code>ValidityState</code></strong> representa os estados de validação que um elemento<em> </em><br>
 pode conter de acordo com as propriedades de validação abaixo. Juntas, elas podem explicar porque um elemento é inválido (caso seja) ao ser validado.</p>

<h2 id="Propriedades">Propriedades</h2>

<p>Para cada uma das propriedades Booleanas abaixo, caso retorne <code><strong>true</strong></code>, isso indica a razão específica porque a validação falhou, exceto no caso da propriedade <em>valid</em>, que retorna <strong><code>true</code></strong> no caso do elemento ser completamente válido e <strong><code>false</code></strong> caso contrário.</p>

<dl>
 <dt>{{domxref("ValidityState.badInput")}} {{ReadOnlyInline}}</dt>
 <dd>É um {{jsxref("Boolean")}} informando se o usuário inseriu um valor que o navegador é incapaz de converter.</dd>
 <dt>{{domxref("ValidityState.customError")}} {{ReadOnlyInline}}</dt>
 <dd>É um {{jsxref("Boolean")}} informando se o elemento possui uma mensagem de validação definida por <code>setCustomValidity()</code> para um valor não vázio.</dd>
 <dt>{{domxref("ValidityState.patternMismatch")}} {{ReadOnlyInline}}</dt>
 <dd>É um {{jsxref("Boolean")}} informando se o valor não combina com o padrão ({{htmlattrxref("pattern", "input")}}) especificado.</dd>
 <dt>{{domxref("ValidityState.rangeOverflow")}} {{ReadOnlyInline}}</dt>
 <dd>É um {{jsxref("Boolean")}} informando se o valor é maior do que o máximo especificado pelo atributo {{htmlattrxref("max", "input")}}.</dd>
 <dt>{{domxref("ValidityState.rangeUnderflow")}} {{ReadOnlyInline}}</dt>
 <dd>É um {{jsxref("Boolean")}} informando se o valor é menor do que o mínimo especificado pelo atributo {{htmlattrxref("min", "input")}}.</dd>
 <dt>{{domxref("ValidityState.stepMismatch")}} {{ReadOnlyInline}}</dt>
 <dd>É um {{jsxref("Boolean")}} informando se o valor não segue a regra definida pelo atributo {{htmlattrxref("step", "input")}}.</dd>
 <dt>{{domxref("ValidityState.tooLong")}} {{ReadOnlyInline}}</dt>
 <dd>É um {{jsxref("Boolean")}} informando se o valor ultrapassa o especificado pelo atributo <code>maxlength</code> para {{domxref("HTMLInputElement")}} ou {{domxref("HTMLTextAreaElement")}}. <em><strong>OBS:</strong> Isso nunca será <code>true</code> em navegadores como o Firefox, pois a inserção de valores não é permitida ao alcançar o valor definido em <code>maxlength</code>.</em></dd>
 <dt>{{domxref("ValidityState.tooShort")}} {{ReadOnlyInline}}</dt>
 <dd>É um {{jsxref("Boolean")}} informando se o valor não corresponde ao especificado no atributo <code>minlength</code> para {{domxref("HTMLInputElement")}} ou {{domxref("HTMLTextAreaElement")}}.</dd>
 <dt>{{domxref("ValidityState.typeMismatch")}} {{ReadOnlyInline}}</dt>
 <dd>É um {{jsxref("Boolean")}} informando se o valor não corresponde ao tipo de entrada definida. (Um exemplo é quando {{htmlattrxref("type", "input")}} é <code>email</code> ou <code>url</code>).</dd>
 <dt>{{domxref("ValidityState.valid")}} {{ReadOnlyInline}}</dt>
 <dd>É um {{jsxref("Boolean")}} informando se o elemento é completamente válido.</dd>
 <dt>{{domxref("ValidityState.valueMissing")}} {{ReadOnlyInline}}</dt>
 <dd>É um {{jsxref("Boolean")}} informando que o elemento tem o atributo {{htmlattrxref("required", "input")}}, mas não tem {{htmlattrxref("value", "input")}}.</dd>
</dl>

<h2 id="Especificações">Especificações</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Especificação</th>
   <th scope="col">Status</th>
   <th scope="col">Comentário</th>
  </tr>
  <tr>
   <td>{{ SpecName('HTML WHATWG', 'forms.html#the-constraint-validation-api', 'ValidityState') }}</td>
   <td>{{Spec2('HTML WHATWG')}}</td>
   <td>Live Standard</td>
  </tr>
  <tr>
   <td>{{ SpecName('HTML5.1', '#the-constraint-validation-api', 'ValidityState') }}</td>
   <td>{{Spec2('HTML5.1')}}</td>
   <td>No change from the previous snapshot {{SpecName('HTML5 W3C')}}.</td>
  </tr>
  <tr>
   <td>{{ SpecName('HTML5 W3C', 'forms.html#the-constraint-validation-api', 'ValidityState') }}</td>
   <td>{{Spec2('HTML5 W3C')}}</td>
   <td>First snapshot of  {{SpecName('HTML WHATWG')}} containing this interface.</td>
  </tr>
 </tbody>
</table>

<h2 id="Compatibilidade_com_navegadores">Compatibilidade com navegadores</h2>

<div class="hidden">A tabela de compatibilidade desta página é gerada a partir de dados estruturados. Se você gostaria de contribuir com estes dados, por favor, veja <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> e nos envie um pull request.</div>

<p>{{Compat("api.ValidityState")}}</p>

<h2 id="Veja_também">Veja também</h2>

<ul>
 <li><a href="/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation">Constraint validation</a></li>
 <li><a href="/en-US/docs/Web/Guide/HTML/Forms/Data_form_validation">Forms: Data form validation</a></li>
</ul>