జావాస్క్రిప్ట్ Validation API

సింగిల్ వెరిఫికేషన్ మరియు ప్రత్యక్ష వెరిఫికేషన్ ప్రక్రియలను పరిశీలించే డామిన్ ప్రక్రియలు మరియు అనునాయితీలు కలిగి ఉంటుంది.

పద్ధతి

పద్ధతి వివరణ
checkValidity() ఇన్పుట్ పెలుపు లో నిజమైన డేటా ఉన్నప్పుడు true తిరిగి తెలుపుతుంది.
setCustomValidity() ఇన్పుట్ పెలుపు యొక్క validationMessage అనునది సెట్ చేస్తుంది.

అంశం

అంశం వివరణ
validity ఇన్పుట్ పెలుపు యొక్క నిర్ణయం బ్లూవర్ అనునది కలిగి ఉంటుంది.
validationMessage నిర్ణయం కాదు అయితే బ్రాఉజర్ చూపిస్తుంది సందేశం కలిగి ఉంటుంది.
willValidate చూడండి ఇన్పుట్ పెలుపును పరిశీలించాలా కాదు నిర్ణయిస్తుంది.

ఇన్స్టాన్స్ - checkValidity() పద్ధతి

సంకేతపదం లో అనేకరకాలను చూపిస్తుంది అని సందేశం చూపిస్తుంది:

<input id="id1" type="number" min="100" max="300" required>
<button onclick="myFunction()">సరే</button>
<p id="demo"></p>
<script>
function myFunction() {
  const inpObj = document.getElementById("id1");
  if (!inpObj.checkValidity()) {
    document.getElementById("demo").innerHTML = inpObj.validationMessage;
  }
}
</script>

స్వయంగా ప్రయత్నించండి

ప్రమాణాల అంశాలు

ఇన్పుట్ అంశంప్రమాణాల అంశాలుఅనేక డేటా ప్రమాణాలకు సంబంధించిన అంశాలు కలిగి ఉంటాయి:

అంశం వివరణ
customError అనుకూల ప్రమాణాల మీద నిర్ణయించబడిన ప్రమాణాల సందర్భంలో నిజంగా సెట్ చేయబడుతుంది.
patternMismatch అంశం విలువ ప్యాటర్న్ అంశం కంటే విలువకాక ఉంటే నిజంగా సెట్ చేయబడుతుంది.
rangeOverflow అంశం విలువ గరిష్ట అంశం కంటే ఎక్కువ ఉంటే నిజంగా సెట్ చేయబడుతుంది.
rangeUnderflow అంశం విలువ లోపం అంశం కంటే తక్కువ ఉంటే నిజంగా సెట్ చేయబడుతుంది.
stepMismatch అంశం విలువ స్టేప్ అంశం కంటే చెల్లని ఉంటే నిజంగా సెట్ చేయబడుతుంది.
tooLong అంశం విలువ గరిష్ట పొడవు అంశం కంటే ఎక్కువ ఉంటే నిజంగా సెట్ చేయబడుతుంది.
typeMismatch అంశం విలువ తప్పు ఉంటే నిజంగా సెట్ చేయబడుతుంది.
valueMissing అంశం లేదా అవసరమైన అంశం లేకపోతే నిజంగా సెట్ చేయబడుతుంది.
చెల్లని అంశం విలువ చెల్లనిది ఉంటే నిజంగా సెట్ చేయబడుతుంది.

ఉదాహరణ

rangeOverflow అంశం

ఇన్పుట్ ఫీల్డ్ లో సంఖ్య గరిష్టం 100 (ఇన్పుట్ యొక్క గరిష్టం అంశ) మంచిది ఉంటే సందేశం ప్రదర్శించబడుతుంది:

<input id="id1" type="number" max="100">
<button onclick="myFunction()">సరే</button>
<p id="demo"></p>
<script>
function myFunction() {
  let text = "విలువ సరే";
  if (document.getElementById("id1").validity.rangeOverflow) {
    text = "విలువ అధికంగా ఉంది";
  }
}
</script>

స్వయంగా ప్రయత్నించండి

rangeUnderflow అంశం

ఇన్పుట్ ఫీల్డ్ లో సంఖ్య గరిష్టం 100 (ఇన్పుట్ యొక్క గరిష్టం అంశ) మంచిది ఉంటే సందేశం ప్రదర్శించబడుతుంది:

<input id="id1" type="number" min="100">
<button onclick="myFunction()">సరే</button>
<p id="demo"></p>
<script>
function myFunction() {
  let text = = "Value OK";
  if (document.getElementById("id1").validity.rangeUnderflow) {
    text = "Value too small";
  }
}
</script>

స్వయంగా ప్రయత్నించండి