HTML form એ વેબ ડેવલપમેન્ટનો નિર્ણાયક ભાગ છે જે વપરાશકર્તાઓને વેબસાઇટ સાથે ક્રિયાપ્રતિક્રિયા કરવા અને સર્વર પર ડેટા સબમિટ કરવાની મંજૂરી આપે છે. Form તેનો ઉપયોગ વિશાળ શ્રેણીના હેતુઓ માટે થાય છે, જેમ કે વપરાશકર્તાને એકત્ર કરવા form, વપરાશકર્તાના ઇનપુટ પર પ્રક્રિયા કરવા અને વેબસાઇટ પર વપરાશકર્તાની ક્રિયાઓને સક્ષમ કરવા. આ લેખમાં, અમે વિશેષતાઓ અને ઇનપુટ ક્ષેત્રોના વિવિધ પ્રકારો, HTML માં સામાન્ય રીતે ઉપયોગમાં લેવાતા તત્વો, ટેક્સ્ટેરિયા અને બટનો પસંદ કરીશું form.
ઇનપુટ ક્ષેત્રો
<input type="text">: એક ટેક્સ્ટ ઇનપુટ ફીલ્ડ બનાવે છે જ્યાં વપરાશકર્તાઓ આલ્ફાન્યૂમેરિક અક્ષરો દાખલ કરી શકે છે.<input type="password">: પાસવર્ડ ઇનપુટ ફીલ્ડ દર્શાવે છે જે દાખલ કરેલ અક્ષરોને માસ્ક કરે છે.<input type="email">: ઇનપુટ ફીલ્ડ માટે ઇમેઇલ માન્યતા પ્રદાન કરે છે જેને માન્ય ઇમેઇલ સરનામાંની જરૂર હોય છે.<input type="number">: ઇનપુટને માત્ર આંકડાકીય મૂલ્યો પર પ્રતિબંધિત કરે છે.<input type="checkbox">: એક ચેકબોક્સનું પ્રતિનિધિત્વ કરે છે જેને વપરાશકર્તાઓ પસંદ અથવા નાપસંદ કરી શકે છે.<input type="radio">: રેડિયો બટનનું પ્રતિનિધિત્વ કરે છે જે વપરાશકર્તાઓને વિકલ્પોના જૂથમાંથી એક વિકલ્પ પસંદ કરવાની મંજૂરી આપે છે.<input type="file">: વપરાશકર્તાઓને ફાઇલો પસંદ કરવા અને અપલોડ કરવા માટે સક્ષમ કરે છે.<input type="submit">: એક બટન પ્રદર્શિત કરે છે જે form ક્લિક કરવા પર સબમિટ કરે છે.<input type="reset">: એક બટન પ્રદર્શિત કરે છે જે તેને form તેની પ્રારંભિક સ્થિતિમાં રીસેટ કરે છે.<input type="date">: તારીખો પસંદ કરવા માટે તારીખ પીકર પ્રદાન કરે છે.<input type="time">: વપરાશકર્તાઓને સમય મૂલ્યો ઇનપુટ કરવાની મંજૂરી આપે છે.
તત્વો પસંદ કરો
<select>: પસંદ કરી શકાય તેવા વિકલ્પો સાથે ડ્રોપડાઉન મેનુ બનાવે છે.<option>: ડ્રોપડાઉન મેનૂની અંદર એક વિકલ્પ વ્યાખ્યાયિત કરે છે, જે<select>ટેગની અંદર મૂકવામાં આવે છે.<optgroup>: ડ્રોપડાઉન મેનૂમાં એકસાથે જૂથ સંબંધિત વિકલ્પો.<select multiple>: વપરાશકર્તાઓને ક્લિક કરતી વખતે Ctrl કી(અથવા Mac પર કમાન્ડ કી) દબાવી રાખીને એકસાથે બહુવિધ વિકલ્પો પસંદ કરવાની મંજૂરી આપે છે.
ટેક્સ્ટરેઝ
<textarea>: મલ્ટિલાઇન ટેક્સ્ટ ઇનપુટ ફીલ્ડ બનાવે છે જ્યાં વપરાશકર્તાઓ ટેક્સ્ટના લાંબા બ્લોક્સ દાખલ અને સંપાદિત કરી શકે છે. rows તેનું કદ બદલી શકાય છે અને cols તેના પરિમાણોને વ્યાખ્યાયિત કરવા જેવા લક્ષણો સાથે ગોઠવી શકાય છે .
બટનો
<button>: એક બટનનું પ્રતિનિધિત્વ કરે છે જે એક ની અંદર વિવિધ ક્રિયાઓને ટ્રિગર કરી શકે છે form. તેનો ઉપયોગ જાવાસ્ક્રિપ્ટ ફંક્શન form દીઠ form, સબમિટ કરવા અથવા અલગ પૃષ્ઠ પર નેવિગેટ કરવા માટે થઈ શકે છે.
ઉદાહરણ ઉપયોગ:
<form action="/submit-form" method="post">
<label for="name">Name:</label>
<input type="text" id="name" name="name" required>
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
<label for="message">Message:</label>
<textarea id="message" name="message" rows="4" cols="50"></textarea>
<label for="newsletter">Subscribe to Newsletter:</label>
<input type="checkbox" id="newsletter" name="newsletter">
<label for="color">Favorite Color:</label>
<select id="color" name="color">
<option value="red">Red</option>
<option value="blue">Blue</option>
<option value="green">Green</option>
</select>
<button type="submit">Submit</button>
</form>
આ ઉદાહરણ ક્ષેત્રો,, , અને બટન form સહિત વિવિધ ઘટકોનો ઉપયોગ દર્શાવે છે. તમારી વિશિષ્ટ આવશ્યકતાઓને આધારે તત્વો અને વિશેષતાઓને કસ્ટમાઇઝ કરવા માટે મફત લાગે. input textarea checkbox select dropdown submit form