field-select
নেটিভ select-এর চারপাশে field-এর মোড়ক। দশটির বেশি অপশন হলে select, select.js-এর ছেঁকে নেওয়া কম্বোবক্স চালু করে; তবু ফর্ম যা পাঠায় তা ওই নেটিভ select-ই।
তিনটি বিকল্প: নেটিভ select
এটি <section rst-box><form rst-form>-এর ভেতরে রাখুন।
<div rst-field >
<label rst-field-label for ="sel_few" >ভূমিকা</label >
<select rst-input id ="sel_few" name ="sel_few" >
<option value ="admin" selected >অ্যাডমিন</option >
<option value ="editor" >সম্পাদক</option >
<option value ="member" >সদস্য</option >
</select >
</div >
এটি <section rst-box><form rst-form>-এর ভেতরে রাখুন।
{{ template "field-select" dict
"ID" "sel_few"
"Name" "sel_few"
"Label" "ভূমিকা"
"Options" (list
(dict "Label" "অ্যাডমিন" "Selected" true "Value" "admin" )
(dict "Label" "সম্পাদক" "Value" "editor" )
(dict "Label" "সদস্য" "Value" "member" ))}}
বারোটি বিকল্প: ফিল্টারযোগ্য কম্বোবক্স
এটি <section rst-box><form rst-form>-এর ভেতরে রাখুন।
<div rst-field >
<label rst-field-label for ="sel_many" >শহর</label >
<select rst-input id ="sel_many" name ="sel_many" data-rst-select data-rst-select-filter ="ফিল্টার করতে টাইপ করুন" data-rst-select-results ="{n}টি ফলাফল" data-rst-select-result-one ="১টি ফলাফল" data-rst-select-no-matches ="কোনো মিল নেই" aria-describedby ="sel_many-help" >
<option value ="dublin" selected >ডাবলিন</option >
<option value ="lisbon" >লিসবন</option >
<option value ="madrid" >মাদ্রিদ</option >
<option value ="berlin" >বার্লিন</option >
<option value ="rome" >রোম</option >
<option value ="athens" >এথেন্স</option >
<option value ="helsinki" >হেলসিঙ্কি</option >
<option value ="reykjavík" >রেইকিয়াভিক</option >
<option value ="warsaw" >ওয়ারশ</option >
<option value ="zagreb" >জাগরেব</option >
<option value ="tallinn" >তালিন</option >
<option value ="valletta" >ভাল্লেত্তা</option >
</select >
<p rst-field-help id ="sel_many-help" >ছাঁকতে লিখতে শুরু করুন।</p >
</div >
এটি <section rst-box><form rst-form>-এর ভেতরে রাখুন।
{{ template "field-select" dict
"ID" "sel_many"
"Name" "sel_many"
"Label" "শহর"
"Options" (list
(dict "Label" "ডাবলিন" "Selected" true "Value" "dublin" )
(dict "Label" "লিসবন" "Value" "lisbon" )
(dict "Label" "মাদ্রিদ" "Value" "madrid" )
(dict "Label" "বার্লিন" "Value" "berlin" )
(dict "Label" "রোম" "Value" "rome" )
(dict "Label" "এথেন্স" "Value" "athens" )
(dict "Label" "হেলসিঙ্কি" "Value" "helsinki" )
(dict "Label" "রেইকিয়াভিক" "Value" "reykjavík" )
(dict "Label" "ওয়ারশ" "Value" "warsaw" )
(dict "Label" "জাগরেব" "Value" "zagreb" )
(dict "Label" "তালিন" "Value" "tallinn" )
(dict "Label" "ভাল্লেত্তা" "Value" "valletta" ))
"Help" "ছাঁকতে লিখতে শুরু করুন।" }}
দশটির বেশি অপশন হলে পার্শিয়ালটি select.js চালু করে। দশের কম হলে করে না: গুটিকয় জিনিসের মধ্যে খোঁজা আসবাব মাত্র, সাহায্য নয়।
বারোটি অপশন, Plain: উন্নতিটি নাকচ করা
এটি <section rst-box><form rst-form>-এর ভেতরে রাখুন।
<div rst-field >
<label rst-field-label for ="sel_plain" >শহর</label >
<select rst-input id ="sel_plain" name ="sel_plain" >
<option value ="dublin" selected >ডাবলিন</option >
<option value ="lisbon" >লিসবন</option >
<option value ="madrid" >মাদ্রিদ</option >
<option value ="berlin" >বার্লিন</option >
<option value ="rome" >রোম</option >
<option value ="athens" >এথেন্স</option >
<option value ="helsinki" >হেলসিঙ্কি</option >
<option value ="reykjavík" >রেইকিয়াভিক</option >
<option value ="warsaw" >ওয়ারশ</option >
<option value ="zagreb" >জাগরেব</option >
<option value ="tallinn" >তালিন</option >
<option value ="valletta" >ভাল্লেত্তা</option >
</select >
</div >
এটি <section rst-box><form rst-form>-এর ভেতরে রাখুন।
{{ template "field-select" dict
"ID" "sel_plain"
"Name" "sel_plain"
"Label" "শহর"
"Options" (list
(dict "Label" "ডাবলিন" "Selected" true "Value" "dublin" )
(dict "Label" "লিসবন" "Value" "lisbon" )
(dict "Label" "মাদ্রিদ" "Value" "madrid" )
(dict "Label" "বার্লিন" "Value" "berlin" )
(dict "Label" "রোম" "Value" "rome" )
(dict "Label" "এথেন্স" "Value" "athens" )
(dict "Label" "হেলসিঙ্কি" "Value" "helsinki" )
(dict "Label" "রেইকিয়াভিক" "Value" "reykjavík" )
(dict "Label" "ওয়ারশ" "Value" "warsaw" )
(dict "Label" "জাগরেব" "Value" "zagreb" )
(dict "Label" "তালিন" "Value" "tallinn" )
(dict "Label" "ভাল্লেত্তা" "Value" "valletta" ))
"Plain" true }}
আবশ্যিক, একটি ত্রুটিসহ
এটি <section rst-box><form rst-form>-এর ভেতরে রাখুন।
<div rst-field >
<label rst-field-label for ="sel_error" >ভূমিকা</label >
<select rst-input id ="sel_error" name ="sel_error" required aria-invalid ="true" aria-describedby ="sel_error-error" >
<option value ="admin" selected >অ্যাডমিন</option >
<option value ="editor" >সম্পাদক</option >
<option value ="member" >সদস্য</option >
</select >
<p rst-field-error id ="sel_error-error" role ="alert" >এই ব্যক্তির জন্য একটি ভূমিকা বেছে নিন।</p >
</div >
এটি <section rst-box><form rst-form>-এর ভেতরে রাখুন।
{{ template "field-select" dict
"ID" "sel_error"
"Name" "sel_error"
"Label" "ভূমিকা"
"Options" (list
(dict "Label" "অ্যাডমিন" "Selected" true "Value" "admin" )
(dict "Label" "সম্পাদক" "Value" "editor" )
(dict "Label" "সদস্য" "Value" "member" ))
"Required" true
"Error" "এই ব্যক্তির জন্য একটি ভূমিকা বেছে নিন।" }}
হাতে লেখা, optgroup সহ
এটি <section rst-box><form rst-form>-এর ভেতরে রাখুন।
<div rst-field >
<label rst-field-label for ="sel_grouped" >অঞ্চল</label >
<select rst-input id ="sel_grouped" name ="sel_grouped" data-rst-select data-rst-select-filter ="ফিল্টার করতে টাইপ করুন" data-rst-select-results ="{n}টি ফলাফল" data-rst-select-result-one ="১টি ফলাফল" data-rst-select-no-matches ="কোনো মিল নেই" >
<optgroup label ="ইউরোপ" >
<option value ="dublin" selected >ডাবলিন</option >
<option value ="lisbon" >লিসবন</option >
<option value ="warsaw" >ওয়ারশ</option >
</optgroup >
<optgroup label ="আমেরিকা মহাদেশ" >
<option value ="montreal" >মন্ট্রিয়ল</option >
<option value ="lima" >লিমা</option >
<option value ="austin" >অস্টিন</option >
</optgroup >
<optgroup label ="এশিয়া" >
<option value ="osaka" >ওসাকা</option >
<option value ="hanoi" >হ্যানয়</option >
<option value ="dhaka" >ঢাকা</option >
</optgroup >
<optgroup label ="আফ্রিকা" >
<option value ="accra" >আক্রা</option >
<option value ="nairobi" >নাইরোবি</option >
<option value ="tunis" >তিউনিস</option >
</optgroup >
</select >
</div >
এখানে Options একটি সমতল তালিকা, তাই দলবদ্ধ পছন্দগুলো অ্যাপ নিজেই মার্কআপ হিসেবে লেখে। select.js দলগুলো ফেলে না দিয়ে এঁকে দেয়; হাতে লেখা কোনো select চাইলে data-rst-select="false" দিয়ে উন্নতিটি একেবারেই নাকচ করতে পারে।