क्या मैं HTML5 में <select> फ़ील्ड के लिए आवश्यक विशेषता लागू कर सकता हूं?

Question

अगर कोई उपयोगकर्ता <select>HTML5 में किसी फ़ील्ड से किसी चीज़ का चयन करता है, तो मैं कैसे जांच सकता हूं ?

मैं देख रहा हूं <select>कि नई requiredविशेषता का समर्थन नहीं करता ... क्या मुझे जावास्क्रिप्ट का उपयोग करना है? या क्या मुझे कुछ याद आ रहा है? : /

Comments

यदि आप क्रॉस-ब्राउज़र संगतता के किसी भी स्तर में रुचि रखते हैं, तो आपको संभवतः जावास्क्रिप्ट का उपयोग करना होगा। वह विशेषता जो आप चाहते हैं selectedIndex।

— ल्यूक स्नेनरिंग

एचटीएमएल 5 कल्पना (6 अगस्त 2011) के वर्तमान संपादक के मसौदे के अनुसार, चयनित तत्व में एक आवश्यक विशेषता है। "आवश्यक विशेषता एक बूलियन विशेषता है। निर्दिष्ट किए जाने पर, उपयोगकर्ता को फ़ॉर्म सबमिट करने से पहले एक मूल्य का चयन करना होगा।" dev.w3.org/html5/spec/Overview.html#the-select-element

— james.garriss

Answer 1

अनिवार्य : खाली मानों पर पहला मान खाली होना चाहिए

आवश्यक शर्तें : सही HTML5 DOCTYPE और एक नामित इनपुट फ़ील्ड

<select name="somename" required>
<option value="">Please select</option>
<option value="one">One</option>
</select>

प्रलेखन के अनुसार (लिस्टिंग और बोल्ड मेरा है)

आवश्यक विशेषता एक बूलियन विशेषता है।
निर्दिष्ट करते समय, उपयोगकर्ता को फ़ॉर्म सबमिट करने से पहले एक मूल्य का चयन करना होगा।

यदि एक चयनित तत्व

• एक आवश्यक विशेषता निर्दिष्ट है,
• एक से अधिक गुण निर्दिष्ट नहीं है,
• और 1 का प्रदर्शन आकार है (SIZE = 2 या अधिक नहीं है - यदि आवश्यक नहीं है तो इसे छोड़ दें);
• और यदि चयनित तत्व की विकल्पों की सूची में पहले विकल्प तत्व का मान (यदि कोई हो) खाली स्ट्रिंग है (अर्थात वर्तमान में value=""),
• और वह विकल्प तत्व का मूल नोड चुनिंदा तत्व है (और ऑप्टग्रुप तत्व नहीं),

फिर वह विकल्प चुनिंदा तत्व का प्लेसहोल्डर लेबल विकल्प है।

Comments

इसके अलावा, ताकि उपयोगकर्ता चुने जाने के बाद गैर-विकल्प का चयन न कर सके: <विकल्प चयनित = "चयनित" अक्षम "=" अक्षम "मान =" "> कृपया चयन करें </ विकल्प>

— CoolAJ86

इसका कोई मतलब नहीं है ... इसके अलावा यह कई ब्राउज़रों पर काम नहीं करेगा

— mplungjan

@ CoolAJ86 क्रोम 23, फ़ायरफ़ॉक्स 16 और IE 10 में अच्छी तरह से काम करता है।

— केटीबी

मैं 2 डाउनवोट देखता हूं। अगर आपको ऐसा लगता है तो कृपया इस टिप्पणी को WHY के

— बताएं

प्रलेखन का विरोधाभास बहुत मददगार है; धन्यवाद

— skia.heliou

Answer 2

<select>तत्व का समर्थन करता है requiredविशेषता, कल्पना के अनुसार:

• http://dev.w3.org/html5/spec-author-view/the-select-element.html#the-select-element

कौन सा ब्राउज़र इसका सम्मान नहीं करता है?

(बेशक, आपको सर्वर पर वैसे भी मान्य करना होगा, क्योंकि आप इस बात की गारंटी नहीं दे सकते कि उपयोगकर्ता जावास्क्रिप्ट सक्षम होंगे।)

Comments

मुझे यकीन है कि उन्हें पहली प्रविष्टि पर केवल एक मूल्य = "" की आवश्यकता थी - अगर कोई मूल्य विशेषता या सभी विकल्पों पर कोई मूल्य नहीं है, तो ट्रिगर करने के लिए आवश्यक विफल हो जाता है क्योंकि चयन एक वास्तविक मूल्य देता है

— mplungjan

@ मम्प्लुंगजान: आह , गच्चा - अच्छी तरह से देखा।

— पॉल डी। वेट

@ PaulD.Waite क्या हम अभी भी गारंटी नहीं दे सकते हैं कि उपयोगकर्ताओं के पास जावास्क्रिप्ट सक्षम होगा? मैं केवल 2 साल के लिए वेब विकास में रहा हूं और मैं उस समस्या में कभी नहीं चला हूं।

— user137717

@ user137717: यह वेब है। आप कुछ भी गारंटी नहीं दे सकते। आप निश्चित रूप से यह तय कर सकते हैं कि यह खानपान के लायक नहीं है।

— पॉल डी। वेट

Answer 3

आप selectedडिफ़ॉल्ट रूप से एक विकल्प का चयन करने के लिए विकल्प तत्व के लिए विशेषता का उपयोग कर सकते हैं । आप requiredयह सुनिश्चित करने के लिए कि उपयोगकर्ता कुछ का चयन करता है, तत्व के लिए विशेषता का उपयोग कर सकते हैं ।

जावास्क्रिप्ट में, आप selectedIndexचयनित विकल्प का सूचकांक प्राप्त करने के लिए संपत्ति की जांच कर सकते हैं, या आप चयनित विकल्प valueके मूल्य को प्राप्त करने के लिए संपत्ति की जांच कर सकते हैं।

HTML5 युक्ति के अनुसार, selectedIndex"यदि कोई चयनित वस्तु नहीं है, तो पहले चयनित आइटम का सूचकांक, यदि कोई हो, या if1, तो valueवापस लौटाता है । " और यदि है तो पहले चयनित आइटम का मान लौटाता है। कोई चयनित आइटम नहीं है। "तो अगर चयनितIndex = -1, तो आप जानते हैं कि उन्होंने कुछ भी नहीं चुना है।

<button type="button" onclick="displaySelection()">What did I pick?</button>
<script>
    function displaySelection()
    {
        var mySelect = document.getElementById("someSelectElement");
        var mySelection = mySelect.selectedIndex;
        alert(mySelection);
    }
</script>

Comments

@ पोस्ट - कृपया संपादन के माध्यम से इस उत्तर को बदलने का प्रयास करना बंद करें। अगर आपको लगता है कि यह गलत है, तो बेझिझक अपना जवाब दें।

— ब्रैड लार्सन

@ ब्रैडलर्सन पहले तो मैं बिल्कुल समझ नहीं पाया: इस प्रश्न में समस्या का पूरा समाधान कोड नहीं है या इस उत्तर के अंतिम पैराग्राफ के लिए एक व्याख्यात्मक उदाहरण है। इस मामले में शायद दूसरे नंबर पर है। मैं इस कोड को स्निपेट के रूप में व्यवस्थित करना और परिणाम दिखाना बेहतर समझता हूं -1। क्षमा करें, मैंने पहले टिप्पणियों में स्पष्ट नहीं किया था।

— प्रेषित

Answer 4

हां, यह काम कर रहा है:

<select name="somename" required>
     <option value="">Please select</option>
     <option value="one">One</option>
</select>

आपको पहले विकल्प को खाली रखना होगा।

Answer 5

<form action="">

<select required>

  <option selected disabled value="">choose</option>
  <option value="red">red</option>
  <option value="yellow">yellow</option>
  <option value="green">green</option>
  <option value="grey">grey</option>

</select>
<input type="submit">
</form>

Comments

यह उत्तर केवल पिछले उदाहरण को दोहराता है जिसमें कोई अतिरिक्त स्पष्टीकरण नहीं है।

— james.garriss

Answer 6

पहले आपको पहले विकल्प में रिक्त मान असाइन करना होगा। यानी यहाँ चयन करें। केवल आवश्यक काम करेगा।

Answer 7

रिक्त करने के लिए चयन बॉक्स के पहले आइटम का मूल्य बनाएं।

इसलिए जब आप प्रत्येक FORM को पोस्ट करते हैं तो आपको खाली मान मिलता है और इस तरह से आप जानते हैं कि उपयोगकर्ता ने ड्रॉपडाउन से कुछ भी नहीं चुना है।

<select name="user_role" required>
    <option value="">-Select-</option>
    <option value="User">User</option>
    <option value="Admin">Admin</option>
</select>

Answer 8

आपको खाली स्ट्रिंग की valueविशेषता निर्धारित करने की आवश्यकता है option:

<select name="status" required>
    <option selected disabled value="">what's your status?</option>
    <option value="code">coding</option>
    <option value="sleep">sleeping</option>
</select>

selectवापस आ जाएगी valueचयनित optionजब उपयोगकर्ता प्रेस सर्वर से submitपर form। एक खाली valueएक खाली textइनपुट के रूप में ही है -> requiredसंदेश को ऊपर उठाना ।

---

w3schools

मान विशेषता निर्दिष्ट करता है जब कोई फ़ॉर्म सबमिट किया जाता है तो सर्वर पर भेजा जाना चाहिए।

उदाहरण

Answer 9

यह कोशिश करो, यह काम करने वाला है, मैंने यह और यह काम करने की कोशिश की है।

<!DOCTYPE html>
<html>
<body>

<form action="#">
<select required>
  <option value="">None</option>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>
<input type="submit">
</form>

</body>
</html>

Answer 10

यदि पहले विकल्प का मूल्य शून्य है तो पूरी तरह से ठीक है। स्पष्टीकरण: HTML5 बटन सबमिट पर एक शून्य मान पढ़ेगा। यदि शून्य (मान विशेषता) नहीं है, तो चयनित मान को शून्य नहीं माना जाता है, इसलिए सत्यापन ने काम किया होगा अर्थात विकल्प टैग में डेटा होने पर जाँच करके। इसलिए यह सत्यापन विधि का उत्पादन नहीं करेगा। हालाँकि, मुझे लगता है कि दूसरा पक्ष स्पष्ट हो जाता है, यदि मान विशेषता शून्य पर सेट है (मान = ""), HTML5 पहले या बजाय डिफ़ॉल्ट चयनित विकल्प पर एक रिक्त मान का पता लगाएगा, जिससे सत्यापन संदेश निकल जाएगा। पूछने के लिए धन्यवाद। मदद करने के लिए खुश। मुझे यह जानकर खुशी हुई।

Answer 11

Html5 में आप पूर्ण अभिव्यक्ति का उपयोग कर सकते हैं:

<select required="required">

मुझे नहीं पता कि छोटी अभिव्यक्ति क्यों काम नहीं करती है, लेकिन इसे आज़माएं। इसका हल निकलेगा।

Answer 12

इसे इस्तेमाल करे

<select>
<option value="" style="display:none">Please select</option>
<option value="one">One</option>
</select>

Answer 13

आप इसे JQuery के साथ गतिशील रूप से भी कर सकते हैं

सेट की आवश्यकता है

$("#select1").attr('required', 'required');

आवश्यक निकालें

$("#select1").removeAttr('required');