Wiki source code of URL-Parameter

Show last authors
1 {{content/}}
2
3 When you open a form, you can add additional parameters to the URL of the form to prefill some form fields. You need to separate URL parameters from the main URL by adding a question mark **?**. If you need multiple parameters, separate them with an ampersand **&**. This results the following pattern for the URL:
4
5 {{code language="none"}}
6 http://<host>//formcycle/form/alias/1/demo?<field1Name>=<field1Value>&<field2Name>=<field2Value>&...
7 {{/code}}
8
9 Please note that when you need to use special characters, you need to [[escape them>>url:https://en.wikipedia.org/wiki/Percent-encoding]]. For example, to specify an URL parameters named //tfCompany// with the value //Clark & Joe Ltd.//:
10
11 {{code language="none"}}
12 http://<host>//formcycle/form/alias/1/demo?tfCompany=Clark%20%26%20Joe%20Ltd.
13 {{/code}}
14
15 == Using URL parameters ==
16
17 You can use URL parameters to prefill form fields both when the form is opened for the first time as well as when a saved or submitted form is opened again. Please note that existing form field values are overwritten when URL parameters are used.
18
19 == Examples ==
20
21 === Prefilling an input field ===
22
23 {{figure image="designer_url_param_textfield_en.png"}}
24 Setup in the {{designer/}} for prefilling an input field.
25 {{/figure}}
26
27 {{figure image="designer_url_param_textfield_demo_en.png"}}
28 When opening the form, we set the URL parameter //tfMail//. This sets the initial value of the corresponding input field.
29 {{/figure}}
30
31 Create a [[input field>>doc:Formcycle.Designer.Form.FormElements.Input]] with the name //tfMail//. When you open the form, add the URL parameter //tfMail// and set it to an email address. The URL could look like:
32
33 {{code language="none"}}
34 http://<host>/formcycle/form/alias/1/demo?tfMail=johndoe@example.com
35 {{/code}}
36
37 As shown in the figure to the right, this sets the initial value of the input field to the given email address.
38
39 === Prefilling a select field ===
40
41 {{figure image="designer_url_param_select_en.png"}}
42 Setup in the {{designer/}} for prefilling a select field.
43 {{/figure}}
44
45 {{figure image="designer_url_param_select_demo_en.png"}}
46 When opening the form, we set the URL parameter //selSex//. This sets the initial value of the corresponding select field.
47 {{/figure}}
48
49 You can preselect an option of a [[select field>>doc:Formcycle.Designer.Form.FormElements.Selection]] as well. Note that you cannot use the displayed name as the value of the URL parameter. You need to use the value specified in the //values// column of the options section in the properties panel of the {{designer/}}.
50
51 Create a select field with the name //selSex//. When you open the form, add the URL parameter //selSex// and set it to //f//. The URL could look like:
52
53 {{code language="none"}}
54 http://<host>/formcycle/form/alias/1/demo?selSex=f
55 {{/code}}
56
57 As shown in the figure to the right, this preselects the option //female//.
58
59 {{info}}
60 You cannot prefill [[repeated elements>>doc:Formcycle.Designer.Form.ElementProperties.BaseProperties||anchor="repeat"]]. It is also not possible to set the initial number of repetitions via URL parameters.
61 {{/info}}
62
63 === Changing the form layout ===
64
65 {{figure image="CSSTheme_eng.PNG"}}
66 To open a form with a different layout (CSS theme), use the URL paramter //xfc-rp-theme// and pass the UUID of the CSS theme as the value. The UUID is shown in the details panel (1) to the right hand side of the //Layout (CSS)// menu.
67 {{/figure}}
68
69 You can create different form layouts (CSS themes) in the [[Layout (CSS)>>Formcycle.UserInterface.FilesAndTemplates.Layout]] menu. You can then assign one form layout to each form. If you want to open a form with a different layout, such as a blue or red variation of your main theme, you can use an optional URL parameter.
70
71 The name of the URL parameter is //xfc-rp-theme//, and its value needs to be the UUID of the form layout. You can view the UUID of each form layout in the [[Layout (CSS)>>Formcycle.UserInterface.FilesAndTemplates.Layout]] menu (see screenshot to the right).
72
73 For example:
74
75 {{code language="none"}}
76 http://<host>/formcycle/form/alias/1/demo?xfc-rp-theme=<UUID>
77 http://<host>/formcycle/form/alias/1/demo?xfc-rp-theme=8b4a9c2d-34d9-4cff-8759-9b54ed4b0ff1
78 {{/code}}