Bootstrap 5 फॉर्म वेरिफिकेशन

फॉर्म वैधीकरण

अलग-अलग वैधीकरण क्लासों का उपयोग करके उपयोगकर्ता को मूल्यवान प्रतिक्रिया प्रदान कर सकते हैं। कृपया .was-validated या .needs-validation फॉर्म एलिमेंट के लिए जोड़ें, विशेष रूप से आप फॉर्म सबमिट करने से पहले या बाद में वैधीकरण प्रतिक्रिया प्रदान करना चाहते हैं। इनपुट फील्ड को हरी (वैध) या लाल (अवैध) बॉर्डर होगा, जो फॉर्म में लागू नहीं किए गए सामग्री को संकेत करेगा। आप इसके साथ .valid-feedback या .invalid-feedback संदेश, ताकि उपयोगकर्ता को स्पष्ट रूप से बताया जा सके कि किस चीज़ को लागू करने की आवश्यकता है या फॉर्म सबमिट करने से पहले जो करना है।

उदाहरण

इस उदाहरण में, हम फॉर्म सबमिट करने से पहले .was-validated क्या लागू नहीं है इसको सूचित करें:}}

<form action="/action_page.php" class="was-validated">
  <div class="mb-3 mt-3">
    <label for="uname" class="form-label">उपयोगकर्ता नाम：</label>
    <input type="text" class="form-control" id="uname" placeholder="उपयोगकर्ता नाम भरें" name="uname" required>
    <div class="valid-feedback">वैध है。</div>
    <div class="invalid-feedback">इस फील्ड को भरें।</div>
  </div>
  <div class="mb-3">
    <label for="pwd" class="form-label">पासवर्ड：</label>
    <input type="password" class="form-control" id="pwd" placeholder="पासवर्ड भरें" name="pswd" required>
    <div class="valid-feedback">वैध है。</div>
    <div class="invalid-feedback">इस फील्ड को भरें।</div>
  </div>
  <div class="form-check mb-3">
    <input class="form-check-input" type="checkbox" id="myCheck" name="remember" required>
    <label class="form-check-label" for="myCheck">मैं इन शर्तों को सहमत हूँ।</label>
    <div class="valid-feedback">वैध है。</div>
    <div class="invalid-feedback">इस चेकबॉक्स को चुनकर आगे बढ़ें।</div>
  </div>
  <button type="submit" class="btn btn-primary">सबमिट करें</button>
</form>

स्वयं प्रयोग करें