HTML DOM इनपुट नंबर required प्रॉपर्टी

परिचय

HTML DOM इनपुट नंबर required प्रॉपर्टी प्राप्त करती है और संशोधित करती है कि फॉर्म सबमिट करने से पहले नंबर इनपुट फील्ड भरना अनिवार्य है या नहीं।

सिंटैक्स

मान प्राप्त करना

object.required

मान सेट करना

object.required = true | false

उदाहरण

फॉर्म सबमिशन पर नंबर इनपुट की required वैलिडेशन जांचना:

<!DOCTYPE html>
<html>
<head>
<style>
  html { height: 100%; }
  body {
    text-align: center;
    color: #fff;
    background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat;
    height: 100%;
  }
  p { font-weight: 700; font-size: 1.1rem; }
  input {
    display: block;
    width: 35%;
    border: 2px solid #fff;
    background-color: transparent;
    color: #fff;
    font-weight: bold;
    padding: 8px;
    margin: 1rem auto;
  }
  .btn {
    background: #0197F6;
    border: none;
    height: 2rem;
    border-radius: 2px;
    width: 35%;
    margin: 2rem auto;
    display: block;
    color: #fff;
    outline: none;
    cursor: pointer;
  }
  .show { font-size: 1.5rem; color: #db133a; font-weight: bold; }
</style>
</head>
<body>
<h1>DOM इनपुट नंबर required प्रॉपर्टी डेमो</h1>
<form action="">
  <p>हाय, अपनी जन्म तिथि का दिन दर्ज करें</p>
  <input type="number" class="numberInput" required>
  <input type="submit" onclick="checkInput()">
</form>
<div class="show"></div>
<script>
  function checkInput() {
    var numberInput = document.querySelector(".numberInput");
    if (numberInput.value === '') {
      document.querySelector(".show").innerHTML = "कृपया चुनें";
    }
  }
</script>
</body>
</html>

आउटपुट

नंबर इनपुट फील्ड में कोई मान दर्ज किए बिना "सबमिट" बटन पर क्लिक करने पर ब्राउज़र की डिफ़ॉल्ट वैलिडेशन "कृपया चुनें" संदेश दिखाएगा।