HTML form यूजर साइड से डाटा को लेकर सर्वर पर सेंड करने के लिए उपयोग किये जाते हैं । HTML form डाटा को कलेक्ट करने के लिए उपयोग किये जाते हैं ।साधारण Hindi भाषा में समझे तो जब आप कोई रजिस्ट्रेशन करते हैं या कोई फॉर्म भरते हैं तो तब आपके सामने बहुत सरे fields आते हैं जैसे name , father name , mobile , qualification जैसे बहुत सारे फील्ड आते हैं उन फ़ील्ड्स को भरकर जब आप सबमिट बटन पर क्लिक करते हैं तो डाटा सर्वर पर स्टोर हो जाता हैं ।
HTML form को बनान बहुत ही आसान होता हैं बस आपको इसके elements के बारे में पता होना चाइये ।
HTML का उपयोग करके form बनाने और डिजाइन करने के लिए आपको सभी HTML फॉर्म elements के बारे में जानना होगा। HTML <form> का उपयोग यूजर से जानकारी एकत्र(collect) करने के लिए किया जाता है।
HTML फॉर्म में डेटा को इकट्ठा करने के लिए विभिन्न एलिमेंट होते हैं।
सिंटेक्स
Syntax-
action एलिमेंट -
एक्शन एलिमेंट के उपयोग जब करते हैं जब डाटा को सर्वर पर insert करना होता हैं । एक्शन एलिमेंट में हम कोई भी अलग फाइल को डिफाइन करते हैं । एक्शन एलिमेंट HTML form के एक्शन को हैंडल करता हैं ।
method एलिमेंट -
मेथड एलिमेंट प्रोग्रामिंग भाषा जैसे PHP प्रोग्रामिंग में मेथड GET method और POST Method को define करते हैं ।
ये सब आपको अभी समझ लेना चाइये ताकि जब आप कोई programming भाषा का उपयोग करके डाटा को सर्वर पर ट्रांसफर करे तो आपके लिए अच्छा रहेगा ।
<input> इनपुट हटम्ल फॉर्म का एलिमेंट होता हैं जिसमे टाइप को डिफाइन किया जाता हैं । इनपुट के साथ इनपुट टाइप को भी डिफाइन करना होता हैं । ये सब आप आगे example से अच्छे समझा आजायेगा ।
name- name के द्वारा इनपुट fields के एक अलग नाम डिफाइन किया जाता हैं । प्रत्येक इनपुट के लिए अलग नाम डिफाइन करते हैं ।
HTML फॉर्म का निम्नलिखित उदाहरण जिसमें विभिन्न element शामिल हैं ।
ऊपर दिए गए उदाहरण में में form के अंत में सबमिट बटन भी होता है। जब बटन फॉर्म पर क्लिक करते हैं तो फॉर्म का डाटा सर्वर पर स्टोर हो जाता हैं ।
यहाँ पर सिर्फ हम HTML form को बनाना सिख रहे हैं ।
चलीये HTML फॉर्म के और अधिक एलिमेंट्स के बारे में समझते हैं ।
radio बटन एलिमेंट -
रेडियो बटन एलिमेंट बटन एक को चुनने देता है।
साधारण Hindi में कहे तो रेडियो बटन गोल होते हैं जिस पर क्लिक करने पर grey color का एक टिक हो जाता हैं । रेडियो बटन अधिकतर जेंडर(gender) को डिफाइन करने के लिए फॉर्म में यूज किये जाते हैं ।
HTML form में रेडियो button को अधिकतर ऑप्शन चुन ने के लिए उपयोग किया जाता हैं ।
जैसे -
Male
Female
Other
select एलिमेंट -
सभी विकल्पों में से किसी भी विकल्प का सेलेक्ट करने के लिए HTML form के सेलेक्ट एलिमेंट का उपयोग किया जाता है।
Input एलिमेंट के प्रकार-
<input type = "number"> - मोबाइल नंबर, ज़िप कोड जैसे इनपुट नंबर डिफाइन करते हैं ।
नंबर इनपुट टाइप में केवल डिजिट(digit) को ही भरा जा सकता हैं । डिजिट जैसे - 1,2,3,4,5,6,7,8,9,0 .
<input type = "email"> -HTML form input टाइप ईमेल का उपयोग ईमेल आदि को भरने के लिए किया जाता हैं जैसे - yourmail@example.com
इसमें वेलिडेशन(validation) की जरूरत नहीं पड़ती हैं । इस फील्ड में केवल ईमेल आईडी को ही भरा जाता हैं और ईमेल आईडी के लिए ही टाइप ईमेल का उपयोग किया जाता हैं ।
<input type = "radio"> रेडियो बटन के लिए टाइप radio डिफाइन करना पड़ता हैं ।
<input type = "checkbox"> - चेक बॉक्स , बॉक्स की तरह होते हैं जिस पर क्लिक करने पर एक टिक आ जाता हैं । बहुत सारे ऑप्शन के लिए हम चेकबॉक्स का उपयोग भी कर सकते हैं ।यह HTML form का अच्छा एलिमेंट माना जाता हैं ।
<input type = "password"> - HTML फॉर्म में जैसे ईमेल के लिए email टाइप उपयोग किया जाता हैं ऐसे ही पासवर्ड के लिए password इनपुट टाइप का उपयोग किया जाता हैं ।
पासवर्ड टाइप देने पर पासवर्ड की जगह स्टार (**********) कुछ इसी तरिके से आजाते भें जिस से पासवर्ड को सिक्योरिटी मिलती हैं ।
<textarea> -textarea बहुत सारे टेक्स्ट को भरने के लिए उपयोग किया जाता हैं । textarea में rows और columns होते हैं ।
चलिए एक HTML form बनाते हैं -
HTML फॉर्म का निम्नलिखित उदाहरण जिसमें इनपुट टाइप टेक्स्ट, रेडियो, नंबर, ईमेल और सबमिट बटन है।
इस example से आप ऊपर दिए गए HTML form की सभी जानकारी को समझा पाएंगे ।
HTML Form
<!DOCTYPE html>
<html>
<head>
<title>HTML Form </title>
</head>
<body>
</body>
</html>
Run
इस तरह से आप आसानी से कोई भी HTML form को बना सकते हैं ।
Recommended Posts:-