(HTML) Form Tag in Hindi

HTML पेज में यूजर से कोई जानकारी लेने के लिए Form टैग का इस्तेमाल लिया जाता है, <form> टैग में जो जानकारी डाली जाती है, वो सब form सबमिट होने पर सर्वर को भेजी जाती है

फॉर्म टैग का खास काम इनपुट फील्ड्स के समूह डाटा को एक साथ सर्वर पर भेजना है।

<form> टैग की लाक्षणिकता

जैसे जैसे वक्त बीत रहा है, वैसे वैसे HTML में फॉर्म टैग को इस्तेमाल करने के अलग अलग तरीके देखने को मिल रहे है, तो सबसे पहले हमे <form> टैग को इस्तेमाल करने का मूलभूत तरीका पता होना जरूरी है।

  1. फॉर्म टैग सिर्फ डाटा लेने के लिए इस्तेमाल किया जाता है।
  2. फॉर्म टैग में <input> टैग्स डाटा कलेक्टर की तरह इस्तेमाल होते है।
  3. फॉर्म टैग से डाटा सर्वर को भेजा जाता है।

<input> टैग्स क्या है? और क्यू इस्तेमाल होते है?

फॉर्म में कई सारे प्रकार का डाटा आ सकता है, जैसे की नाम, नंबर, ईमेल आदि, तो इन भिन्न-भिन्न इनपुट को सही से फॉर्म में लेने के लिए इनपुट टैग्स इस्तेमाल होते है।

<input> टैग में “type” नाम के ऐट्रब्यूट में हम इनपुट में किस प्रकार का डाटा आएगा वो निर्धारित करते है,
अगर हमने किसी इनपुट के ऐट्रब्यूट को “type” = “email” दिया हो, तो उस फील्ड में ईमेल के अलावा कोई भी वैल्यू नहीं सबमिट होगी, जिसको फॉर्म validation भी कहते है।

https://colognelove.com/html/input-tags-and-attributes-with-examples-in-hindi/

फॉर्म टैग कैसे इस्तेमाल करे?

HTML में फॉर्म टैग का इस्तेमाल करना बहुत ही आसान है, नीचे बताए गए उदाहरण को फॉलो करने आप एक अच्छा फॉर्म बना सकते हो।

उदाहरण:

<form method="post" action="get_data.php">
  <label for="name">नाम:</label>
  <input type="text" id="name" name="name"><br><br>
  <label for="email">ईमेल:</label>
  <input type="email" id="email" name="email"><br><br>

  <input type="submit" value="सबमिट">
</form>

आउट्पुट:





तो अब हम ऊपर दिए गए कोड और उसके आउट्पुट(परिणाम) को समझेंगे।

कोई भी <form> टैग जिसके अंदर एक <input> टैग और सबमिट बटन दिया गया हो उसे हम स्टैन्डर्ड फॉर्म बोल सकते है।

उदाहरण में हमने 2 फॉर्म टैग ऐट्रब्यूट देखे,

  1. method
  2. action

<form> Tag Methods

फॉर्म टैग में method ऐट्रब्यूट से फॉर्म सबमिट होने के बाद डाटा किस तकनीक से सर्वर को ट्रैन्स्फर होगा वो बताता है।

फॉर्म में डाटा ट्रैन्स्फर के लिए 2 तकनीक है, जिनकी हमने नीचे चर्चा की है,

  1. GET Method
  2. POST Method

GET Method: इस मेथड में ट्रैन्स्फर किया जा रहा डाटा, हम वेब ब्राउजर के URL सेक्शन में देख सकते है।
जिन फॉर्म का काम सिर्फ डाटा सर्च करने जैसी चीजों के लिए होता है, उसमे इस method का इस्तेमाल होता है।
महत्वपूर्ण फॉर्म का डाटा जैसे के लॉगिन फॉर्म के ईमेल और पासवर्ड जैसी चीजों के लिए इस method इस्तेमाल नहीं करना चाहिए।

POST Method: इस मेथड में ट्रैन्स्फर हो रहा डाटा हम आसानी से नहीं देख सकते, इस डाटा को देखने के लिए हमें ब्राउजर के नेटवर्क सेक्शन में जाना पड़ता है, जो की डिफ़ॉल्ट छुपा हुवा रहता है।
इस method का इस्तेमाल ज्यादातर उन फॉर्म मे किया जाता है, जिसका डाटा ब्राउजर मे दिखाना सही नहीं रहता, जैसे की लॉगिन डिटेल्स।

अगर हम फॉर्म को कोई भी method नहीं देते तो डिफ़ॉल्ट फॉर्म में GET method होती है।

<form> टैग Action ऐट्रब्यूट

फॉर्म सबमिट होने पर जिस अड्रेस पर डाटा भेजना हो उसका url action ऐट्रब्यूट में दिया जाता है, जिससे फॉर्म सबमिट होने पर डाटा ट्रैन्स्फर हो सके।

सर्वर में कोई भी प्रोग्रामिंग भाषा जैसे की php, node, python आदि का इस्तेमाल करके हम फॉर्म से दिया गया डाटा ले कर उसको अपने database में संग्रह कर सकते है।

इस का उदाहरण हमने ऊपर वाले HTML कोड में देखा है।

अगर हम फॉर्म में इस ऐट्रब्यूट का इस्तेमाल नहीं करते तो, ब्राउजर आपके फॉर्म का डाटा सबमिट होने पर उसी पेज(same page) को सर्वर समझ कर भेज देता है।

https://colognelove.com/html/html-tags-in-hindi/embed/#?secret=2L5dsyoIYh#?secret=Gen7h0M9NL

हमें आशा है की आपको हमारा ये ब्लॉग जरूर पसंद आया होगा, अगर आपकी कोई सलाह या सुझाव हो तो आप हमें कमेन्ट सेक्शन में बात सकते है, धन्यवाद।

Leave a Reply

Your email address will not be published. Required fields are marked *

AdBlocker Detected!

https://i.ibb.co/9w6ckGJ/Ad-Block-Detected-1.png

Dear visitor, it seems that you are using an adblocker please take a moment to disable your AdBlocker it helps us pay our publishers and continue to provide free content for everyone.

Please note that the Brave browser is not supported on our website. We kindly request you to open our website using a different browser to ensure the best browsing experience.

Thank you for your understanding and cooperation.

Once, You're Done?