繰り返し要素を含むフォームを作成する方法

Question

問題を要約するのに問題があるので、タイトルは実際にそれを言っていません。だからここに長い説明を行く：

はのは、私は、複数の連絡先の情報を追加している、と私はこれらのフィールドを持っているとしましょう：連絡先（電子メール、電話番号の接触

法の

• 名を、インスタントメッセージ）
  • 電子メールの場合：翔：インスタントメッセージ場合
  • 電話番号フィールドを表示：電話番号が場合
  • （のは、このフィールドが存在するとしましょう）電子メールフィールドを表示しますテキストフィールドwが

だから、右のバットオフは、私はJavaScriptをページ自体にこれを完了するために必要とするつもりだ私はとOKだけど、（追加または削除連絡先フィールドを追加します）。しかし、私は複数の連絡先を追加できるので（ソフトウェア開発者として、追加したい連絡先の数がわからない場合は、1,10、または100）

私は各フィールドの名前のようなものを構造化するつもりです。私はnames[],contactmethods[]のようなものにすべてを投げて、順番にアクセスするか、より良い解決策があるかどうかを判断する必要があります。

さらに、サーバーがこれらの情報の検証を開始し、不正な情報が見つかった場合、クライアントがサーバーに送信したデータをクライアントに送り返して、失われないようにしたいと考えています彼らが入力したすべて。どのように簡単に達成できますか？

いくつかの背景情報： テクノロジーズ現在使用されている（つまり、関連性の）：

• フラスコ
• jQueryの
• WTForms

Answer 1

少なくともサーバー上で（何かを構築する必要はありませんサイド） - WTFormsは既にあなたが必要とするものをサポートしています - それは"field enclosures"と呼ばれます。あなたが上form.validate()を呼び出すと

# 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) 

：あなたが探している行動が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をも必要となりますサーバー側では、フィールドが自動的に要件と照合され、エラーが適切に入力され、クライアント側でエラーが返されます。

クライアント側で新しいフィールドを作成するのは簡単です.WTFormsは、using the same naming convention it usesという名前で、つまりfield.short_name + '-' + indexの名前を付けている限り、バックエンドでそれらを取得します。