दोहराए गए तत्वों के साथ एक फॉर्म कैसे बनाएं

Question

शीर्षक वास्तव में यह नहीं कहता है, क्योंकि मुझे इस मुद्दे को सारांशित करने में समस्या हो रही है। तो यहाँ लंबे स्पष्टीकरण जाता है:

चलो कहते हैं कि मैं कई संपर्कों की सूचना जोड़ रहा है, और मैं इन क्षेत्रों है:

संपर्क
• संपर्क की विधि (ईमेल, फोन नंबर का नाम
• , त्वरित संदेश)
  • तो ईमेल: एक फोन नंबर क्षेत्र
  • त्वरित संदेश, तो दिखाएं: एक ई क्षेत्र दिखाएँ (मान लीजिए कि इस क्षेत्र मौजूद है)
  • तो फोन नंबर जाने Sho जो मैं के साथ ठीक हूँ, (जोड़ सकते हैं या विलोपन संपर्क फ़ील्ड्स जोड़ने के लिए) एक पाठ क्षेत्र डब्ल्यू

तो बल्ले से दूर सही, मैं जावास्क्रिप्ट पेज पर ही यह पूरा करने के लिए की आवश्यकता होगी, जा करने के लिए जा रहा हूँ। हालांकि, चूंकि मैं कई संपर्क जोड़ सकता हूं (और सॉफ़्टवेयर डेवलपर के रूप में, मुझे नहीं पता कि उपयोगकर्ता कितना संपर्क जोड़ना चाहता है, यह 1, 10, या 100 हो सकता है)

तो मेरी सबसे बड़ी समस्या यह है कि मैं प्रत्येक क्षेत्र के नामों की तरह चीजों को ढूढ़ने जा रहा हूं। क्या मुझे सब कुछ names[], contactmethods[] जैसी चीजों में फेंकना चाहिए और क्रम में चीजों तक पहुंचना चाहिए, या यदि कोई बेहतर समाधान है।

इसके अतिरिक्त, यदि सर्वर इन जानकारी को सत्यापित करना शुरू करता है, और कुछ विकृत जानकारी पाता है, तो मैं क्लाइंट को सर्वर पर वापस भेजा गया डेटा भेजने में सक्षम होना चाहता हूं, इसलिए वे हार नहीं जाते वे सब कुछ दर्ज किया है। मैं इसे आसानी से कैसे पूरा करूं?

कुछ पृष्ठभूमि जानकारी: टेक्नोलॉजीज वर्तमान में उपयोग में (जो प्रासंगिक है):

• बोतल
• jQuery
• WTForms

Answer 1

कुछ भी (निर्माण करने के लिए कम से कम सर्वर पर कोई ज़रूरत नहीं पक्ष) - WTForms पहले से ही आपको जो चाहिए उसे समर्थन देता है - यह उन्हें "field enclosures" कहता है। व्यवहार आप देख रहे हैं wtforms.fields.FormField में पाया जाता है और wtforms.fields.FieldList

class ContactForm(Form): 
    name = TextField("Name", validators=[Required()]) 
    contact_type = SelectField("Contact Type", 
           validators=[Required()], 
           choices=[ 
            ("email", "Email"), 
            ("phone", "Phone Number"), 
            ("im", "Instant Message") 
           ]) 
    # `If` is a custom validator - see below 
    email_address = TextField("Email", 
            validators=[If("contact_type", 
                "email", 
                [Required(), Email()]) 
            ]) 
    phone_number = TextField("Phone #", 
            validators=[If("contact_type", 
                  "phone", [Required()]) 
            ]) 
    im_handle = TextField("IM Handle", 
            validators=[If("contact_type", 
                  "im", [Required()]) 
            ]) 


class SignUpForm(Form): 
    # Other fields go here 
    contacts = FieldList(FormField(ContactForm)) 

तुम भी उपयोगकर्ता की पसंद को देखते हुए एक custom validator जरूरत उपयुक्त क्षेत्र को मान्य करने देंगे,:

# CAUTION: Untested code ahead 
class If(object): 
    def __init__(self, 
         parent, 
         run_validation=None, 
         extra_validators=None, 
         msg=None): 
     self.parent = parent 
     self.msg = msg if msg is not None else u"Invalid" 
     if callable(run_validation): 
      self.run_validation = run_validation 
     else: 
      _run_validation = lambda self, parent, form: parent.data == run_validation 
      self.run_validation = _run_validation 
     self.extra_validators = extra_validators if extra_validators is not None \ 
                else [] 

    def __call__(self, field, form): 
     parent = getattr(form, self.parent) 
     if self.run_validation(parent, form): 
      return field.validate(form, extra_validators=self.extra_validators) 

जब आप पर form.validate() फोन सर्वर पक्ष फ़ील्ड को स्वचालित रूप से आवश्यकताओं के विरुद्ध चेक किया जाएगा और त्रुटियों को उचित रूप से पॉप्युलेट किया जाएगा ताकि आप उन्हें क्लाइंट साइड पर वापस प्रस्तुत कर सकें।

क्लाइंट साइड पर नए फ़ील्ड बनाना सरल है और WTForms उन्हें तब तक उठाएंगे जब तक आप using the same naming convention it uses - field.short_name + '-' + index नाम दें।