အင်ပျူ့တက် တဂ်
input တဂ်သည် HTML ဖောင်၏ အမျိုးမျိုးသော အစိတ်အပိုင်းများကို ဖန်တီးပေးသည်။
သာမန် ထည့်သွင်းရန် အကွက်တန်း၊ စကားဝှက် ထည့်သွင်းရန် အကွက်တန်း၊ ချက်ဘောက်စ် (checkbox)၊
ရေဒီယို ခလုတ်ငယ်များ (radio)၊ ခလုတ် တို့ ဖြစ်သည်။
input တဂ်သည် form တဂ်၏ အတွင်းတွင် ရှိရမည်။
၎င်းမှာ မဖြစ်မနေ မဟုတ်ပါ၊ ဆာဗာသို့ အချက်အလက်များ ပေးပို့ရန် နှင့် ၎င်းတို့ကို PHP ဖြင့်
နောက်ဆက်တွဲ လုပ်ဆောင်ချက်များ အတွက် လိုအပ်သော ဖြစ်သည်။
ပိတ်သော တဂ် (closing tag) မလိုအပ်ပါ။
Attributes (ဝိသေသလက္ခဏာများ)
| Attribute (ဝိသေသလက္ခဏာ) | ဖော်ပြချက် |
|---|---|
type |
ထည့်သွင်းရန် အကွက်တန်း၏ အမျိုးအစားကို သတ်မှတ်ပေးသည်။ အောက်တွင်ကြည့်ပါ။ |
value |
ထည့်သွင်းရန် အကွက်တန်းတွင် ပုံသေ တန်ဖိုး။ ခလုတ်တစ်ခု အတွက်ဆိုလျှင် ၎င်း၏ စာသားကို သတ်မှတ်ပေးသည်။
အသေးစိတ်အတွက် value attribute ကို ကြည့်ပါ။
|
placeholder |
ထည့်သွင်းရန် အကွက်တန်းအတွင်း ရှင်းလင်းချက်၊ အသေးစိတ်အတွက်
placeholder attribute ကို ကြည့်ပါ။
|
name |
ထည့်သွင်းရန် အကွက်တန်း၏ အမည်။ PHP တွင် ထည့်သွင်းရန် အကွက်တန်း၏ အချက်အလက်များကို ရယူရန် လိုအပ်သည်။ ဖောင်၏ မှန်ကန်စွာ အလုပ်လုပ်ရန်အတွက် ထည့်သွင်းရန် အကွက်တန်းများ၏ အမည်များသည် တစ်ခုနှင့်တစ်ခု (တစ်ဖောင်တည်းအတွင်း) တူနေရန် မသင့်ပါ။ တူနေပါက PHP သို့ HTML ကုဒ်အတွင်း အောက်ဆုံးတွင်ရှိသော ထည့်သွင်းရန် အကွက်တန်း၏ အချက်အလက်များ ရောက်ရှိလာမည်။ |
disabled |
ဖောင်၏ အစိတ်အပိုင်းကို (input သာမက မည်သည့် အစိတ်အပိုင်းကိုမဆို) ပိတ်ပင်သည်။
အသေးစိတ်အတွက် disabled attribute ကို ကြည့်ပါ။
|
type attribute ၏ တန်ဖိုးများ
| တန်ဖိုး | ဖော်ပြချက် |
|---|---|
text |
သာမန် စာသား ထည့်သွင်းရန် အကွက်တန်းကို ဖန်တီးပေးသည်။ |
password |
စကားဝှက် အတွက် စာသား ထည့်သွင်းရန် အကွက်တန်းကို ဖန်တီးပေးသည်။ ၎င်းထဲသို့ စာသား ရိုက်ထည့်ကြည့်ပါ - ၎င်းသည် ကြယ်ပုံစံများဖြင့် ပြသပေးမည်။ |
checkbox |
ချက်ဘောက်စ် အမှတ်အသားကို ဖန်တီးပေးသည်။
အသေးစိတ်အတွက် checkbox ကို ကြည့်ပါ။
|
radio |
ရေဒီယို ပြောင်းလဲခလုတ်ကို ဖန်တီးပေးသည်။
အသေးစိတ်အတွက် radio ကို ကြည့်ပါ။
|
hidden |
ဝှက်ထားသော input ကို ဖန်တီးပေးသည်၊ စကရင်ပေါ်တွင် မမြင်ရသော်လည်း value attribute
အတွင်းရှိ အချက်အလက်များကို ဆာဗာသို့ ပေးပို့မည်။
|
button |
ခလုတ်တစ်ခုကို ဖန်တီးပေးသည်။ ဤခလုတ်ကို နှိပ်ခြင်းဖြင့်
ဖောင်ကို ဆာဗာသို့ မပို့ပေးပါ။ ၎င်းကို လင့်ခ် အတွင်းတွင် သို့မဟုတ်
JavaScript မှတစ်ဆင့် အသုံးပြုနိုင်သည်။
ပုံသေအားဖြင့် ခလုတ်တွင် စာသားမရှိပါ (စာသားမပါသော ခလုတ် နမူနာ - ),
၎င်းကို value ကို အသုံးပြု၍ သတ်မှတ်ပေးသည်။
button တဂ်ကိုလည်း ကြည့်ပါ၊
ထိုတဂ်သည်လည်း ခလုတ်ကို ဖန်တီးပေးသည်။
|
submit |
အချက်အလက်များကို ဆာဗာသို့ ပေးပို့မည့် ခလုတ်ကို ဖန်တီးပေးသည်။
ခလုတ်၏ စာသားသည် ဘရောက်ဆာ အပေါ်မူတည်သည်၊ ၎င်းကို value ကို အသုံးပြု၍
ပြောင်းလဲနိုင်သည်။
ခလုတ်ကို ဖန်တီးပေးသည့် button တဂ်ကိုလည်း ကြည့်ပါ။
|
reset |
ဖြည့်စွက်ထားသော ဖောင်ကို ရှင်းလင်းပေးမည့် ခလုတ်ကို ဖန်တီးပေးသည်။
ခလုတ်၏ စာသားသည် ဘရောက်ဆာ အပေါ်မူတည်သည်၊ ၎င်းကို value ကို အသုံးပြု၍
ပြောင်းလဲနိုင်သည်။
|
file |
ဖိုင် ရွေးချယ်ခလုတ်ကို ဖန်တီးပေးသည်။ ဤခလုတ်၏ ဒီဇိုင်းကို CSS မှတစ်ဆင့်
ပြောင်းလဲခွင့် မပြုပါ (သို့သော် ပါးနပ်သော နည်းလမ်းများ ရှိသည်)။ သင့်ဖောင်တွင် ထိုကဲ့သို့သော အကွက်တန်း လိုအပ်ပါက
form တဂ်တွင် enctype attribute
ရှိရမည်၊ ၎င်း၏ တန်ဖိုးမှာ multipart/form-data ဖြစ်ရမည်။
|
HTML5 တွင် type attribute ၏ အသစ်များ
ဤ attribute တန်ဖိုးများသည် အသစ်များ ဖြစ်ပြီး၊ HTML5 တွင်သာ ပေါ်လာသောကြောင့် တချို့ဘရောက်ဆာများတွင် အလုပ်မလုပ်တတ်ပါ သို့မဟုတ် မတူညီသော ဘရောက်ဆာများတွင် မတူညီစွာ အလုပ်လုပ်တတ်ပါသည်။
type attribute ၏ အကြောင်းအရာကို ဘရောက်ဆာက နားမလည်နိုင်ပါက
(ဥပမာ၊ မပံ့ပိုးထားသော သို့မဟုတ် မှားယွင်းစွာ ရိုက်ထည့်ထားသော အခါမျိုး)၊
၎င်းသည် text တန်ဖိုး ထားသကဲ့သို့ပင် သာမန် စာသား input
အစိတ်အပိုင်းအဖြစ် မှတ်ယူမည်။
အောက်ပါ နမူနာများကို မတူညီသော ဘရောက်ဆာများတွင် ကြည့်ပါ။
input များထဲသို့ စာသားများ ရိုက်ထည့်ကြည့်ပြီး ပေးပို့ရန် ခလုတ်ကို နှိပ်ကြည့်ပါ။
စာသားသည် မမှန်ကန်ပါက သို့မဟုတ် အကွက်တန်း ဗလာဖြစ်နေပါက -
ဘရောက်ဆာက အမှားတစ်ခု ပြသပေးမည်။ ဥပမာ၊ email အမျိုးအစား ရှိသော အကွက်တန်းထဲသို့
မမှန်ကန်သော email ကို ရိုက်ထည့်ပါက - ဘရောက်ဆာက ဖောင်ကို ပေးပို့ခွင့် မပြုပဲ
အမှားအကြောင်း သတင်းစကား ပြသပေးမည် (အမှား၏ စာသား နှင့် ၎င်း၏ အပြင်အဆင်ကို html css ဖြင့် ပြောင်းလဲ၍ မရပါ)။
အကွက်တန်း ဗလာဖြစ်နေပါက - ဘရောက်ဆာကလည်း အမှားပြမည်၊
၎င်းကို required attribute ကို အသုံးပြု၍ ရရှိသည်။
| တန်ဖိုး | ဖော်ပြချက် |
|---|---|
email |
|
number |
|
url |
|
tel |
|
search |
|
color |
|
date |
|
month |
|
week |
|
datetime |
|
datetime-local |
|
range |