HTML లో ఫారమ్‌ను ఎలా సృష్టించాలి

వెబ్‌సైట్ యూజర్ నుండి డేటాను సేకరించడం అనేక రకాలుగా చేయవచ్చు. వెబ్‌సైట్‌లలోని ఫారమ్‌లు యూజర్‌ని న్యూస్‌లెటర్‌కి సబ్‌స్క్రైబ్ చేయడం లేదా జాబ్ అప్లికేషన్ ఫారమ్‌గా వ్యవహరించడం వంటి మరింత క్లిష్టమైన ప్రయోజనాన్ని కలిగి ఉంటాయి.

ఏదేమైనా, ఈ సరళమైన నుండి సంక్లిష్టమైన రూపాలన్నింటికీ ఉమ్మడిగా ఉండే ఒక విషయం HTML మరియు మరింత ప్రత్యేకంగా HTML ట్యాగ్.

---

---

ఫారం ట్యాగ్‌ని ఉపయోగించడం

ది ట్యాగ్ అనేది ఒక HTML మూలకం, ఇది ఫారమ్‌ల కోసం బిల్డింగ్ బ్లాక్‌లుగా పరిగణించబడే ఇతర అంశాలను జతపరచడానికి కంటైనర్‌గా ఉపయోగించబడుతుంది. వీటిలో కొన్ని ప్రాథమిక అంశాలు ఉన్నాయి ట్యాగ్, ది ట్యాగ్, మరియు ట్యాగ్.

ది ట్యాగ్ దాని కార్యాచరణకు దోహదపడే ముఖ్యమైన లక్షణాన్ని కలిగి ఉంది. ఈ లక్షణం చర్య అని పిలువబడుతుంది మరియు ఫారమ్‌లోకి ప్రవేశించిన డేటా పాస్ చేయబడే ఫైల్‌ను గుర్తించడానికి ఉపయోగించబడుతుంది.

ట్యాగ్ ఉదాహరణను ఉపయోగించడం







మీ ప్రాజెక్ట్‌లో ఫారమ్ ట్యాగ్‌ను ఎలా ఉపయోగించాలో పై ఉదాహరణ చూపుతుంది. మీరు తీసుకోవాల్సిన ఫారమ్ ట్యాగ్‌ను తెరిస్తే దాన్ని మూసివేయాలని గుర్తుంచుకోవాలి. ఇది ఫారమ్ నిర్మాణాన్ని సృష్టిస్తుంది మరియు ఫారమ్‌లోకి నమోదు చేసిన డేటా సరిగ్గా ప్రాసెస్ చేయబడిందని కూడా నిర్ధారిస్తుంది.

ట్యాగ్ ఉపయోగించి

ది ప్రతి ఇన్‌పుట్ ఫీల్డ్‌లోని డేటాను ఒక రూపంలో వివరించడానికి ట్యాగ్ ఉపయోగించబడుతుంది. ఈ ట్యాగ్‌లో ఒక ఉంది కోసం లక్షణం, ఇది ఫారమ్ యొక్క కార్యాచరణను మెరుగుపరచడానికి ఉపయోగించబడుతుంది.

సంబంధిత: మీ కోడ్‌ను పరీక్షించడానికి ఉత్తమ ఉచిత ఆన్‌లైన్ HTML ఎడిటర్‌లు

---

---

సంబంధిత ఇన్‌పుట్ ఫీల్డ్‌కు కేటాయించిన ఐడి సరిపోలితే కోసం లో విలువ ట్యాగ్ చేయండి, అప్పుడు మీరు లేబుల్‌పై క్లిక్ చేసినప్పుడు ఇన్‌పుట్ ఫీల్డ్ ఆటోమేటిక్‌గా హైలైట్ చేయబడుతుంది.

ట్యాగ్ ఉదాహరణను ఉపయోగించడం


First Name:


పై ఉదాహరణలో మీరు దానిని చూడవచ్చు కోసం లక్షణానికి విలువ కేటాయించబడుతుంది పేరు . అందువల్ల, మీరు ఒక ఇన్‌పుట్ ఫీల్డ్‌ని సృష్టిస్తే పేరు id, మీరు క్లిక్ చేసిన ప్రతిసారీ ఈ ఫీల్డ్ హైలైట్ చేయబడుతుంది ప్రధమ పేరు లేబుల్

---

---

ట్యాగ్ ఉపయోగించి

దాని అత్యంత ప్రాథమిక రూపంలో, ది ట్యాగ్‌ను టెక్స్ట్ బాక్స్‌గా చూడవచ్చు. ది ట్యాగ్ వినియోగదారు నుండి డేటాను సంగ్రహిస్తుంది మరియు దాని అత్యంత కీలకమైన లక్షణాలలో ఒకటి రకం గుణం. ది రకం ఈ టెక్స్ట్ బాక్స్ సేకరించగల డేటా రకాన్ని లక్షణం సూచిస్తుంది.

సంబంధిత: CSS లో పేర్చబడిన ఫారమ్‌ను ఎలా సృష్టించాలి

మీరు కేటాయించగల అనేక విభిన్న విలువలు ఉన్నాయి రకం లక్షణం, కానీ అత్యంత ప్రాచుర్యం పొందిన వాటిలో కొన్ని ఈ క్రింది విధంగా ఉన్నాయి.

• టెక్స్ట్
• సంఖ్య
• ఇమెయిల్
• చిత్రం
• తేదీ
• చెక్ బాక్స్
• రేడియో
• పాస్వర్డ్

ట్యాగ్ ఉదాహరణ ఉపయోగించి


First Name:



ది పై కోడ్‌లోని ట్యాగ్ మూడు విభిన్న లక్షణాలను కలిగి ఉంటుంది, వాటిలో ప్రతి ఒక్కటి ప్రత్యేకమైన ఫంక్షన్ కలిగి ఉంటాయి. ది రకం లక్షణానికి టెక్స్ట్ విలువ కేటాయించబడింది, అంటే టెక్స్ట్ బాక్స్ అక్షరాలను మాత్రమే అంగీకరిస్తుంది.

ది id లక్షణం అనేది టెక్స్ట్ బాక్స్ కోసం ఒక ప్రత్యేకమైన ఐడెంటిఫైయర్, మరియు ఇది చాలా ముఖ్యం ఎందుకంటే ఇది CSS ఫైల్ నుండి ఈ మూలకానికి ప్రాప్యతను అందిస్తుంది. ది పేరు లక్షణం కూడా ఒక ప్రత్యేక గుర్తింపుదారు; అయితే, అభివృద్ధి లక్షణం సర్వర్ వైపు నుండి ఒక మూలకంతో సంకర్షణ చెందడానికి పేరు లక్షణం ఉపయోగించబడుతుంది.

ది id మరియు పేరు క్లయింట్-వైపు నుండి ఒక మూలకం మరియు మరొకటి సర్వర్ వైపు నుండి యాక్సెస్‌ని అందించే లక్షణాలకు సాధారణంగా అదే విలువ కేటాయించబడుతుంది.

చెక్‌బాక్స్ మూలకాన్ని ఉపయోగించడం

మీరు ఉపయోగించగల ఇతర అంశాలతో పోలిస్తే చెక్‌బాక్స్ మూలకం చాలా ప్రత్యేకమైనది ట్యాగ్. సంబంధిత ఎంపికల జాబితా నుండి ఒకటి లేదా అంతకంటే ఎక్కువ ఎంపికలను ఎంచుకోవడానికి ఇది వినియోగదారుని అనుమతిస్తుంది. చెక్ బాక్స్‌లు సులభంగా గుర్తించబడతాయి ఎందుకంటే అవి ఎంచుకున్నప్పుడు చెక్ కలిగి ఉండే చిన్న చదరపు పెట్టెల ద్వారా సూచించబడతాయి.

చెక్‌బాక్స్ ఎలిమెంట్ ఉదాహరణను ఉపయోగించడం


Programming Languages:
Java
JavaScript
Python


పై ఉదాహరణలో, ప్రతి చెక్ బాక్స్ మూలకాలకు విలువ లక్షణం ఉంటుంది, మరియు ఇది చాలా ముఖ్యం ఎందుకంటే ఇది ప్రతి చెక్‌బాక్స్ ఎంపికను సేకరణ నుండి వేరు చేయడానికి సహాయపడుతుంది. అందువల్ల, వినియోగదారు పై ఎంపికల నుండి 'జావా' ఎంచుకుంటే, డేటా దానిని ప్రతిబింబిస్తుంది.

ట్యాగ్ మరియు రేడియో ఎలిమెంట్‌లను ఉపయోగించడం

ది ట్యాగ్ మరియు రేడియో ఎలిమెంట్‌లు ఒకే విధంగా ఉంటాయి, అవి వినియోగదారుని ఒకేసారి ఒకే విలువను ఎంచుకోవడానికి మాత్రమే అనుమతిస్తాయి; అందువల్ల, వారికి ఒకే ఫంక్షన్ ఉందని ఎవరైనా చెప్పగలరు. అయితే, అవి ప్రదర్శనలో చాలా భిన్నంగా ఉంటాయి.

రేడియో మూలకం ప్రదర్శనలో చెక్‌బాక్స్ మూలకానికి దగ్గరగా ఉంటుంది, అయితే, రేడియో మూలకంతో మీకు చతురస్రాలకు బదులుగా వృత్తాలు ఉంటాయి.

ది ట్యాగ్ తప్పనిసరిగా డ్రాప్-డౌన్ బాక్స్‌ని ఉత్పత్తి చేస్తుంది, ఇది వినియోగదారుని ఒకే విలువను ఎంచుకోవడానికి అనుమతిస్తుంది.

ట్యాగ్ మరియు రేడియో ఎలిమెంట్ ఉదాహరణను ఉపయోగించడం


Sex:

Male
Female
Other


Positions Available:
value='Junior Developer'> Junior Developer
value='Mid-level Developer'> Mid-level Developer
value='Senior Developer'> Senior Developer


తేదీ మూలకాన్ని ఉపయోగించడం

తేదీ మూలకం క్లిక్ చేసినప్పుడు క్యాలెండర్‌ను రూపొందించే చిన్న టెక్స్ట్ బాక్స్‌ను ఉత్పత్తి చేస్తుంది. ఉపయోగించి తేదీ మీ ఫారమ్‌లలో ఇన్‌పుట్ టైప్‌గా, వినియోగదారు తప్పు తేదీని నమోదు చేయకుండా సంరక్షించవచ్చు, ఇది తప్పు డేటా సేకరణకు దారితీస్తుంది.

డేట్ ఎలిమెంట్ ఉదాహరణను ఉపయోగించడం




ఇమెయిల్ మరియు పాస్‌వర్డ్ మూలకాన్ని ఉపయోగించడం

ఒక డెవలపర్ ఇమెయిల్ లేదా పాస్‌వర్డ్ విలువలను ఒక లక్షణ లక్షణానికి కేటాయించినప్పుడు ట్యాగ్, అవి ఒక్కోలాంటి టెక్స్ట్ బాక్స్‌ను ఉత్పత్తి చేస్తాయి. అయితే, మీరు ఈ పెట్టెలను ఉపయోగించడం ప్రారంభించినప్పుడు తేడాలు స్పష్టంగా కనిపిస్తాయి.

ఇమెయిల్ మూలకం టెక్స్ట్ బాక్స్‌లో నమోదు చేసిన డేటాను పర్యవేక్షిస్తుంది మరియు ప్రతి సమర్పణ ఒక ఇమెయిల్ చిరునామా యొక్క ప్రామాణిక అవసరాన్ని తీరుస్తుందని నిర్ధారిస్తుంది; అంటే లోకల్ పార్ట్ కలిగి, తరువాత @ సింబల్, మరియు డొమైన్‌తో ముగుస్తుంది.

ఇమెయిల్ ఎలిమెంట్ ఉదాహరణను ఉపయోగించడం




పై ఉదాహరణలో మీరు అనే కొత్త లక్షణాన్ని పరిచయం చేసారు ప్లేస్‌హోల్డర్ , మరియు ఈ లక్షణం టెక్స్ట్ బాక్స్‌లో వాడిపోయిన బూడిద రంగులో ప్రదర్శించబడే టెక్స్ట్ విలువను తీసుకుంటుంది. పై ఉదాహరణలో కనిపించే విధంగా టెక్స్ట్ బాక్స్‌లో ఉంచాల్సిన డేటాను సూచించడానికి ఈ టెక్స్ట్ ఉపయోగించబడుతుంది.

పాస్‌వర్డ్ మూలకం అక్షరాలను టెక్స్ట్‌బాక్స్‌లోకి ఎంటర్ చేస్తున్నప్పుడు ఆస్టరిస్క్‌లుగా మారుస్తుంది. అందువల్ల, మీ కంప్యూటర్ స్క్రీన్ ఇతర వ్యక్తులకు కనిపిస్తే, మీరు నమోదు చేసిన పాస్‌వర్డ్ వారికి కనిపించదు.

పాస్‌వర్డ్ ఎలిమెంట్ ఉదాహరణను ఉపయోగించడం




బటన్ ట్యాగ్ ఉపయోగించి

ఒక రూపంలో, సాధారణంగా రెండు రకాల బటన్లు ఉంటాయి. మొదటిది సమర్పించే బటన్, ఇది ఫారమ్‌లో నమోదు చేసిన డేటాను చర్య లక్షణానికి కేటాయించిన విలువకు సమర్పిస్తుంది (ఇది దీనిలో ఉంది < రూపం> ట్యాగ్).

బటన్ ఉదాహరణ సమర్పించండి

Submit


సాధారణంగా ఒక రూపంలో ఉపయోగించే రెండవ రకం బటన్ రీసెట్ బటన్, ఇది ఒక రూపంలో డేటాను క్లియర్ చేస్తుంది, తద్వారా యూజర్ తాజా డేటాను నమోదు చేయవచ్చు. ది ట్యాగ్‌లో ఒక ఉంది రకం లక్షణం, ఇది బటన్ యొక్క పనితీరును సూచించడానికి ఉపయోగించబడుతుంది. పై ఉదాహరణలో రకం లక్షణం విలువను కేటాయించడం సమర్పించు , అందువలన, ఒక కలిగి ఉన్న బటన్ రకం యొక్క విలువ రీసెట్ ఫారం రీసెట్ చేయడానికి ఉపయోగించబడుతుంది.

రీసెట్ బటన్ ఉదాహరణ

Reset


ఒక ఫారం సృష్టిస్తోంది

HTML లో ఒక సాధారణ ఫారమ్‌ను సృష్టించడానికి మీరు పైన పేర్కొన్న అన్ని ఎలిమెంట్‌లను జతపరచాలి ట్యాగ్.

ఫారమ్ ఉదాహరణను సృష్టించడం






Forms








First Name:

Last Name:




Date of birth:

Age:




Gender:

Male
Female
Other

Email Address:




Positions Available:
value='Junior Developer'> Junior Developer
value='Mid-level Developer'> Mid-level Developer
value='Senior Developer'> Senior Developer



Programming Languages:
Java
JavaScript
Python



Password:

Confirm Password:



Submit
Reset






పై కోడ్ కింది ఫారమ్‌ను ఉత్పత్తి చేస్తుంది:

ఐఫోన్‌లో సత్వరమార్గాన్ని ఎలా సృష్టించాలి

ఇప్పుడు మీరు HTML లో ఒక సాధారణ ఫారమ్‌ను సృష్టించవచ్చు

ఈ ఆర్టికల్ మీకు ఫంక్షనల్ HTML ఫారమ్‌ను రూపొందించడానికి అన్ని టూల్స్ అందిస్తుంది. ఇది ఫారమ్ క్రియేషన్‌లో ఉపయోగించే విభిన్న HTML ట్యాగ్‌లను గుర్తిస్తుంది మరియు ఈ ట్యాగ్‌లతో ఉపయోగించగల విభిన్న లక్షణాలను అన్వేషిస్తుంది.

అయితే, వెబ్‌సైట్‌లలో మీరు చూసే చాలా ఫారమ్‌లు ఒక అదనపు భాగాన్ని కలిగి ఉంటాయి; CSS, ఫారమ్‌ని ప్రాణం పోసేందుకు మరియు మరింత సౌందర్యంగా ఉండేలా చేయడానికి ఉపయోగించబడుతుంది.

షేర్ చేయండి షేర్ చేయండి ట్వీట్ ఇమెయిల్ ఎసెన్షియల్ CSS3 ప్రాపర్టీస్ చీట్ షీట్

మా CSS3 లక్షణాల చీట్ షీట్‌తో ముఖ్యమైన CSS వాక్యనిర్మాణం.

తదుపరి చదవండి సంబంధిత అంశాలు

• ప్రోగ్రామింగ్
• HTML
• వెబ్ అభివృద్ధి
• కోడింగ్ ట్యుటోరియల్స్

రచయిత గురుంచి కదీషా కీన్(21 కథనాలు ప్రచురించబడ్డాయి)

కదీషా కీన్ పూర్తి-స్టాక్ సాఫ్ట్‌వేర్ డెవలపర్ మరియు టెక్నికల్/టెక్నాలజీ రైటర్. ఆమె చాలా క్లిష్టమైన సాంకేతిక భావనలను సరళీకృతం చేసే ప్రత్యేక సామర్థ్యాన్ని కలిగి ఉంది; ఏదైనా సాంకేతిక అనుభవం లేని వ్యక్తి సులభంగా అర్థం చేసుకోగల పదార్థాన్ని ఉత్పత్తి చేయడం. ఆమె రాయడం, ఆసక్తికరమైన సాఫ్ట్‌వేర్‌ను అభివృద్ధి చేయడం మరియు ప్రపంచాన్ని పర్యటించడం (డాక్యుమెంటరీల ద్వారా) పట్ల మక్కువ చూపుతుంది.

కదీషా కీన్ నుండి మరిన్ని

మా వార్తాలేఖకు సభ్యత్వాన్ని పొందండి

టెక్ చిట్కాలు, సమీక్షలు, ఉచిత ఈబుక్‌లు మరియు ప్రత్యేకమైన డీల్స్ కోసం మా వార్తాలేఖలో చేరండి!

సభ్యత్వం పొందడానికి ఇక్కడ క్లిక్ చేయండి