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="month" class="monthInput" required>
  <input type="submit" onclick="checkInput()">
</form>
<div class="show"></div>
<script>
  function checkInput() {
    var monthInput = document.querySelector(".monthInput");
    if (monthInput.value === '') {
      document.querySelector(".show").innerHTML = "कृपया चुनें";
    }
  }
</script>
</body>
</html>

आउटपुट

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