jquery - How to get a build a form with repeated elements well -

The title does not really say this because I'm having trouble summarizing the problem, here's a long explanation. Assuming that I am adding information of several contacts, and I have these areas:

• Contact name <(Email, phone number) , Instant message)
  • If Email: Show an Email field (assuming this field exists)
  • If the phone number: Phone number field Eat
  • If instant message: Show a text field

    So right from the bat, I need Javascript to complete it On the page (to add or remove linking areas), which I am fine with. However, since I can add many contacts (and as a software developer, I do not know how much contact the user wants to add, it can be 1, 10 or 100)

    So my greatest The problem is how am I going to structure things like names for each of the fields, should I put everything in things like names [] , contactmethods [] and Things must be delivered in order, or if any Htr measures.

    In addition to this, if the server starts to verify these alerts, and receives some incorrect information, then I want to be able to send the client back to the customer sending the data, so They do not want to lose what they have entered.

    • Flask
    • jQuery How can I easily complete this?

      Some background information: Technologies currently in use (which are relevant):

      • WTForms

        Do not need to create anything (at least on the server side) - WTForms already supports what you need - This calls them behavior you are looking for and

          class ContactForm (form) is found: name = TextField ("name", verifiers = [required ()] contact_type = SelectField ( "Contact type", value # 'If' is a custom if you have a custom ("IM", "Instant Messaging")), option = [("email", "email"), ("phone", "phone number"), Verifier - see below EMAIL_ADDRESS = TextField ("email", validators = [("contact_type", "email", [required (), email ()])]) PHONE_NUMBER = TextField ("phone #", authenticator = [( "Contact_type", "Phone", [Required ()]] If im_handle = TextField ("IM handles", verifiers = [(("contact_type" "IM", [required ()])]) class SignUpForm (form ): #other field contact here = fieldlist (form field D (Contact form))   
         You will also need to validate the appropriate field according to the user's choice:  
          # Warning: Untested code forward class Are (object): def __init __ (self, parent, run_validation = none, extra_validators = none, msg = none): self.parent = parent self.msg = msg. if msg is second none u "invalid "If repayable (run_validation): self.run_validation = rest run_validation: _run_validation = lambda itself, parent, form: parent.data == run_validation self.run_validation = _run_validation self.ex Tra_validators = extra_validators if there is no extra_validators \ rest [] 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)   
         When you call  form.validate () , the fields automatically from the server Against the tests and errors will be properly populated so that you can re-provide them to the client Ed.  
         Creating new fields on the client side is simple and WTForms will choose them on the back end as long as you name it - that is,  field.short_name + '-' + index .