फ़ॉर्म बिल्डर क्या है?
फ़ॉर्म बिल्डर आपको विज़ुअल एडिटर से कस्टम फ़ॉर्म बनाने देता है। टेक्स्ट फ़ील्ड, ड्रॉपडाउन, चेकबॉक्स और अधिक जोड़ें, फिर फ़ॉर्म को HTML या JSON स्कीमा के रूप में एक्सपोर्ट करें।
चौदह फ़ील्ड प्रकारों में से चुनें: टेक्स्ट, ईमेल, फ़ोन, URL, संख्या, तारीख, फ़ाइल अपलोड, रेटिंग स्केल, ड्रॉपडाउन, चेकबॉक्स, रेडियो, टेक्स्ट एरिया, परिचय टेक्स्ट के लिए विवरण ब्लॉक, और पेज ब्रेक जो लंबे फ़ॉर्म को चरणों में बाँट देते हैं. हर इनपुट फ़ील्ड में एक लेबल, वैकल्पिक मदद टेक्स्ट, प्लेसहोल्डर, ज़रूरी का निशान, और ड्रॉपडाउन व रेडियो के लिए विकल्प सूची होती है. किसी तैयार टेम्पलेट (संपर्क, फ़ीडबैक, सर्वे, पंजीकरण, ऑर्डर, बुकिंग) से शुरू करें, ऊपर/नीचे तीरों से फ़ील्ड क्रम बदलें, पेजों के बीच प्रगति बार के साथ फ़ॉर्म को लाइव देखें, फिर किसी भी साइट में चिपकाने के लिए साफ़-सुथरा स्टाइल वाला HTML पेज या बैकएंड सत्यापन के लिए JSON स्कीमा एक्सपोर्ट करें.
उपयोग कैसे करें
- चरण 1 — नया फ़ील्ड जोड़ने और उसका प्रकार चुनने (टेक्स्ट, ईमेल, फ़ोन, URL, संख्या, तारीख, फ़ाइल, रेटिंग स्केल, ड्रॉपडाउन, चेकबॉक्स, रेडियो, या टेक्स्ट एरिया) के लिए "फ़ील्ड जोड़ें" पर क्लिक करें, लंबे फ़ॉर्म को चरणों में बाँटने के लिए पेज ब्रेक जोड़ें, या तेज़ शुरुआत के लिए कोई तैयार टेम्पलेट लोड करें.
- चरण 2 — किसी भी फ़ील्ड पर क्लिक करके उसका लेबल, प्लेसहोल्डर और आवश्यक स्थिति सेट करें।
- चरण 3 — फ़ॉर्म का लाइव प्रीव्यू देखें, फिर अपने प्रोजेक्ट में इंटीग्रेट करने के लिए HTML कोड या JSON स्कीमा में एक्सपोर्ट करें।
कब उपयोग करें
- किसी स्टैटिक वेबसाइट पर तेज़ी से रजिस्ट्रेशन या RSVP फॉर्म जोड़ने के लिए।
- डेवलपर को सौंपने से पहले फॉर्म का स्कीमा प्रोटोटाइप करने के लिए।
- छात्रों से एक-एक इनपुट टाइप करवाए बिना HTML फॉर्म की मूल बातें सिखाने के लिए।
परिणाम
एक शिक्षक क्लास रजिस्ट्रेशन फ़ॉर्म बनाता है जिसमें छात्र का नाम (आवश्यक टेक्स्ट), ग्रेड स्तर (ड्रॉपडाउन: 9-12), ईमेल (ईमेल वैलिडेशन), और कमेंट टेक्स्टएरिया शामिल हैं — फिर स्कूल वेबसाइट पर एम्बेड करने के लिए HTML एक्सपोर्ट करता है।
अक्सर पूछे जाने वाले प्रश्न
- फॉर्म सबमिट करने पर डेटा कहाँ जाता है?
- डिफ़ॉल्ट रूप से कहीं नहीं। निर्यात किए गए HTML में कोई एक्शन URL नहीं होता, इसलिए सबमिशन कहीं नहीं जाता और डेटा डिवाइस से बाहर नहीं निकलता। जवाब इकट्ठा करने के लिए फॉर्म के एक्शन को अपने एंडपॉइंट, Formspree, Google Forms या किसी सर्वरलेस फ़ंक्शन की ओर इंगित करें।
- क्या पहले से बना फॉर्म वापस एडिटर में आयात किया जा सकता है?
- अभी नहीं। निर्यात एकतरफा है: एडिटर से HTML या JSON तक। अगर बाद में बदलाव करना है तो JSON स्कीमा सहेज लें और उससे फॉर्म फिर से बनाएँ, या काम ख़त्म होने तक एडिटर सेशन खुला रखें।
- मेरे ड्रॉपडाउन विकल्प क्यों नहीं दिख रहे?
- ड्रॉपडाउन और रेडियो को विकल्प सूची में कम से कम एक प्रविष्टि चाहिए। फील्ड पर क्लिक करें, ऑप्शन्स सेक्शन खोलें और हर विकल्प कॉमा या नई पंक्ति से अलग करके टाइप करें। ख़ाली सूची होने पर सिर्फ एक खाली सेलेक्ट रेंडर होता है।
- क्या निर्यात HTML में कोई स्टाइलिंग शामिल होती है?
- हाँ — अब हर HTML निर्यात में एक छोटी अंतर्निहित स्टाइलशीट शामिल होती है, इसलिए फ़ाइल खोलते ही फॉर्म साफ़ और पठनीय दिखता है: व्यवस्थित स्पेसिंग, इनपुट बॉर्डर, फोकस रिंग और स्टाइल वाला सबमिट बटन। CSS न्यूनतम और स्वतंत्र है, इसलिए इसे वैसा ही रख सकते हैं या स्टाइल ब्लॉक हटाकर अपनी Tailwind, Bootstrap या फ्रेमवर्क क्लास डाल सकते हैं।
- HTML और JSON निर्यात में क्या फर्क है?
- HTML तैयार है—पेज में चिपकाओ और रेंडर हो जाएगा। JSON एक संरचित स्कीमा है जिसमें फील्ड प्रकार, लेबल और वैलिडेशन नियम होते हैं, जो React, Vue या react-hook-form व Formik जैसी लाइब्रेरी से रेंडर करने के लिए उपयुक्त है।
संबंधित उपकरण
सर्वेक्षण निर्माता
बहु-प्रश्न सर्वेक्षण बनाएँ और प्रतिक्रियाएँ एकत्र करें
क्विज़ मेकर
बहुविकल्पीय क्विज़ बनाएं और साझा करें
कानबन बोर्ड
प्रोजेक्ट प्रबंधन के लिए ड्रैग-एंड-ड्रॉप टास्क बोर्ड
वेडिंग प्लानर
शादी की योजना चेकलिस्ट और ट्रैकर
प्रायोरिटी मैट्रिक्स
आइज़नहावर मैट्रिक्स से कार्य व्यवस्थित करें
निर्णय मैट्रिक्स
विकल्पों को अंक देकर निष्पक्ष रूप से तुलना करें