Dropdown List မှ ရွေးချယ်ထားသော အချက်အလက် အမှတ်စဉ်
Select များတွင် လက်ရှိရွေးချယ်ထားသော list item ၏ အမှတ်စဉ်ကို သိမ်းဆည်းထားသည့် အထူးဂုဏ်သတ္တိတစ်ခုရှိပါသည်။
selectedIndex၊ ဤအမှတ်စဉ်သည် သုညမှစ၍ ရေတွက်ပါသည်။
ဤဂုဏ်သတ္တိကို ဖတ်ရှုနိုင်သလို ပြင်ဆင်ရေးသားကာ list ၏ရွေးချယ်ထားသော item ကို ပြောင်းလဲနိုင်ပါသည်။
ဥပမာတစ်ခုဖြင့် ဤဂုဏ်သတ္တိနှင့် အလုပ်လုပ်ပုံကို ကြည့်ရှုကြပါစို့။ ကျွန်ုပ်တို့တွင် အောက်ပါ dropdown list ရှိသည်ဆိုပါစို့။
<select id="select">
<option value="one">တစ်</option>
<option value="two" selected>နှစ်</option>
<option value="three">သုံး</option>
</select>
ရွေးချယ်ထားသော list item ၏ အမှတ်စဉ်ကို ထုတ်ကြည့်ကြပါစို့။
let select = document.querySelector('#select');
console.log(select.selectedIndex); // 1 ကို ပြသမည်
ယခု အခြား item တစ်ခုခုကို ရွေးချယ်ကြည့်ပါမည်။
let select = document.querySelector('#select');
select.selectedIndex = 2; // 'သုံး' ကို ရွေးချယ်မည်
Input တစ်ခုနှင့် select တစ်ခုကို ပေးထားသည်။ Input ထဲသို့ ဂဏန်းတစ်ခုခု ရိုက်ထည့်ပါ။ Focus လက်လွတ်သွားသောအခါ input မှတန်ဖိုးနှင့် ညီမျှသော အမှတ်စဉ်ရှိ list item ကို ရွေးချယ်အောင် လုပ်ဆောင်ပေးပါ။
တစ်ပတ်အတွင်းရှိ နေ့များ၏ အမည်များဖြင့် dropdown list တစ်ခု ဖန်တီးပါ။ JavaScript ဖြင့် ဤ list တွင် လက်ရှိရက်ကို ပုံသေအနေဖြင့် ရွေးချယ်အောင် လုပ်ဆောင်ပါ။