Generate form fields via front end

(Anewport) #1

I'm trying to create a form similar to this one http://www.tidbinbilla.com.au/birrigai/sevendayfactsform/. The part I'm stuck at is after you select a group type from the drop down, the very last section before CAPTCHA is able to have a seemingly infinite number of 'members' added. Clicking the 'Add person' button generates a new member and related fields to be submitted.

 

Is there a way to replicate this feature in Matrix? At the moment it seems like I would have to create a few extra form sections and hope no one wants to submit more than what I have created.

(Bart Banda) #2

If you want an infinite or very high number of duplicated form sections, I would do it with some tricky JS.

 

So create just 1 section with form fields for each answer, then on the front end, when the user clicks the "add section" button, you just clone the section HTML with JS. Then on submit, you run some JS that brings the data in from all additional sections into single form fields with each value separated with a specific character. 

 

For example, say you have 3 sections created dynamically:

name 1, phone 1, email 1, details 1

name 2, phone 2, email 2, details 2

name 3, phone 3, email 3, details 3

 

On submit, the JS would grab all of this info, and put it into 1 hidden text area field in a JSON or CSV format, like so:

name 1, phone 1, email 1, phone 1|name 2, phone 2, email 2, phone 2|name 3, phone 3, email 3, phone 3

Hope that makes sense and helps.

 

The other solution is off course to create form fields for up to a max number of dynamic sections and just show/hide them with JS, 

(Anewport) #3

Both those solutions are exactly what I was thinking Bart :), although the sensible idea of using a special character for separation didn't occur. Following on with that solution however, it would be possible to use a keyword modifier on the email submissions %response_xx_x% keywords to then make it a little more readable.

Any ideas on what would be the best way to get each section displayed on a new line in an email? I was thinking perhaps using ^nl2br or ^replace but not sure what character to look for in the latter, or what character to insert in the hidden text field. Assuming something like \n or JSON encoding the response may work.

 

I think I might try that option and see how it goes.

(Bart Banda) #4

If you follow my example, you could try and do something like this:

%response_xx_x^replace:,:<br/>^replace:|:<br/><br/>NEW SECTION<br/>%

Would that work?

(Anewport) #5

That has done the trick! Now I should be able to format as needed.

Quick note that using the pipe symbol didn't work well with the modifiers so instead I'm using a semicolon. The pipe symbol for some reason made each character in the submission get split onto its own line making for a very long email.

Thanks heaps for the help Bart.