-
Notifications
You must be signed in to change notification settings - Fork 3
Askia HTML Inputs
This section describes how to generate HTML inputs for the Askia form.
In the HTTP protocol, user-agent (mostly the browser) could send and receive data from and to the server.
AskiaWeb usually uses the verbs `GET` and `POST`, both of them have mostly the same behaviour except that one doesn’t write the parameters to send in the URL.
The parameters are sent as a collection of name/value pairs separate by the ampersand symbol like:
name1=value1&name2=value2&name3=value3
All values are automatically encoded by the browser(URIEncode) while using HTML Form.
AskiaWeb expects to obtain the data format as described in the sections below.
In the sections below:
- XX stand for the id of the question
- YY stand for the id of the response
- VAL stand for an arbitrary value (numeric, date, time or text)
- %20 is the URIEncode for the space character
- %2C is the URIEncode for the coma character
- Numeric question
- Open-ended question
- Date question
- Time question
- Date/Time question
- Single closed question
- Multi-coded question – classical
- Multi-coded question – ranking
- Multi-coded question – list
The input name is the letter C (for Continous) follow by the id of the question: *C*_XX_
CXX=VAL
Example:
C0=12
C1=5.9
All of the following examples produce the same name/value pair C1=5 that will be recognised on the server-side.
<input type="text" name="{%= CurrentQuestion.InputName()%}" value="{%= CurrentQuestion.InputValue()%}" />
Produce:
<input type="text" name="C1" value="5" />
<input type="number" name="{%= CurrentQuestion.InputName()%}" value="{%= CurrentQuestion.InputValue()%}" ↩
min="{%= CurrentQuestion.MinValue%}" max="{%= CurrentQuestion.MaxValue %}" step="1" />
Produce:
<input type="number" name="C1" value="5" min="1" max="5" step="1" />
{% Dim i
Dim rId
Dim checked
For i = CurrentQuestion.MinValue To CurrentQuestion.MaxValue %}
{% rId = CurrentQuestion.InputName() + "_" + i %}
{% checked = On(CurrentQuestion.Value = i, "checked=\"checked\"", "") %}
<input type="radio" name="{%= CurrentQuestion.InputName()%}" id="{%= rId %}" value="{%= i %}" {%:= checked %} /> ↲
<label for="{%= rId %}">{%= i %}</label>
{% Next %}
Produce:
<input type="radio" name="C1" id="C1_1" value="1" /><label for="C1_1">1</label>
<input type="radio" name="C1" id="C1_2" value="2" /><label for="C1_2">2</label>
<input type="radio" name="C1" id="C1_3" value="3" /><label for="C1_3">3</label>
<input type="radio" name="C1" id="C1_4" value="4" /><label for="C1_4">4</label>
<input type="radio" name="C1" id="C1_5" value="5" checked="checked" /><label for="C1_5">5</label>
<select name="{%= CurrentQuestion.InputName()%}">
{% Dim i
Dim selected
For i = CurrentQuestion.MinValue To CurrentQuestion.MaxValue %}
{% selected = On(CurrentQuestion.Value = i, "selected=\"selected\"", "") %}
<option value="{%= i %}" {%:= selected%}>{%= i %}</option>
{% Next %}
</select>
Produce:
<select name="C1">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5" selected="selected">5</option>
</select>
<input type="hidden" name="{%= CurrentQuestion.InputName()%}" value="{%= CurrentQuestion.InputValue()%}" />
Produce:
<input type="hidden" name="C1" value="5" />
The input name is the letter S (for String) follow by the id of the question: *S*_XX_
SXX=VAL
Example:
S0=hello%20world
// Decoded version: S0=Hello world!
All of the following examples produce the same name/value pair S1=Hello world! that will be recognised on the server-side.
<input type="text" name="{%= CurrentQuestion.InputName()%}" value="{%= CurrentQuestion.InputValue()%}" />
Produce:
<input type="text" name="S1" value="Hello world!" />
<textarea name="{%= CurrentQuestion.InputName()%}">{%= CurrentQuestion.InputValue()%}</textarea>
Produce:
<textarea name="S1">Hellow world!</textarea>
{% dim rId = CurrentQuestion.InputName() + "_1"
dim checked = on(CurrentQuestion.Value = "Hello world!", "checked=\"checked\"", "") %}
<input type="radio" name="{%= CurrentQuestion.InputName()%}" id="{%= rId %}" value="Hello world!" {%:= checked%}/> ↩
<label for="{%= rId %}">Hello world!</label>
{% rId = CurrentQuestion.InputName() + "_2"%}
{% checked = on (CurrentQuestion.Value = "Good night!", "checked=\"checked\"", "") %}
<input type="radio" name="{%= CurrentQuestion.InputName()%}" id="{%= rId %}" value="Good night!" {%:= checked%}/> ↩
<label for="{%= rId %}">Good night!</label>
Produce:
<input type="radio" name="S1" id="S1_1" value="Hello world!" checked="checked" /><label for="S1_1">Hello world!</label>
<input type="radio" name="S1" id="S1_2" value="Good night!" /><label for="S1_2">Good night!</label>
<select name="{%= CurrentQuestion.InputName()%}">
{% dim selected = on(CurrentQuestion.Value = "Hello world!", "selected="\selected\"", "") %}
<option value="Hello world!" {%:= selected%}>Hello world!</option>
{% selected = on(CurrentQuestion.Value = "Good night!", "selected="\selected\"", "") %}
<option value="Good night!" {%:= selected%}>Good night!</option>
</select>
Produce:
<select name="S1">
<option value="Hello world!" selected="selected">Hello world!</option>
<option value="Good night!">Good night!</option>
</select>
{% dim checked = on(CurrentQuestion.Value = "Hello world!", "checked=\"checked\"", "") %}
<input type="checkbox" name="{%= CurrentQuestion.InputName()%}" value="Hello world!" {%:= checked%} />
Produce:
<input type="checkbox" name="S1" value="Hello world!" checked="checked" />
<input type="hidden" name="{%= CurrentQuestion.Name()%}" value="{%= CurrentQuestion.InputValue()%}" />
Produce:
<input type="hidden" name="S1" value="Hello world!" />
The input name is the letter D (for Date) follow by the id of the question: *D*_XX_
DXX=VAL
Example:
D1=25%2F12%2F2013
// Decoded version: D1=25/12/2013
All of the following examples produce the same name/value pair D1=12/01/2013 that will be recognised on the server-side.
<input type="text" name="{%= CurrentQuestion.InputName()%}" value="{%= CurrentQuestion.InputValue()%}" />
Produce:
<input type="text" name="D1" value="12/01/2013" />
<input type="date" name="{%= CurrentQuestion.InputName()%}" value="{%= CurrentQuestion.InputValue()%}" ↩
min={%= CurrentQuestion.MinDate%}" max="{%= CurrentQuestion.MaxDate%}" />
Produce:
<input type="date" name="D1" value="12/01/2013" min="12/01/2013" max="14/01/2013"/>
{%
dim i
dim maxCount = CurrentQuestion.MaxDate - CurrentQuestion.MinDate
dim currentDate = CurrentQuestion.MinDate
dim rId
dim checked
For i = 0 To maxCount
currentDate = currentDate + i
rId = CurrentQuestion.InputName() + "_" + (i + 1)
checked = on(CurrentQuestion.Value = currentDate, "checked=\"checked\", "")
%}
<input type="radio" name="{%= CurrentQuestion.InputName()%}" id="{%= rId%}" value="{%= currentDate%}" {%:= checked%} /> ↩
<label for="{%= rId%}">{%= currentDate%}</label>
{% Next %}
Produce:
<input type="radio" name="D1" id="D1_1" value="12/01/2013" checked="checked" /><label for="D1_1">12/01/2013</label>
<input type="radio" name="D1" id="D1_2" value="13/01/2013" /><label for="D1_2">13/01/2013</label>
<input type="radio" name="D1" id="D1_3" value="14/01/2013" /><label for="D1_3">14/01/2013</label>
<select name="{%= CurrentQuestion.InputName()%}">
{%
dim i
dim maxCount = CurrentQuestion.MaxDate - CurrentQuestion.MinDate
dim currentDate = CurrentQuestion.MinDate
dim selected
For i = 0 To maxCount
currentDate = currentDate + i
selected= on(CurrentQuestion.Value = currentDate, "selected=\"selected\", "")
%}
<option value="{%= currentDate%}" {%:= selected%} />{%= currentDate%}</option>
{% Next %}
</select>
Produce:
<select name="D1">
<option value="12/01/2013" selected="selected">12/01/2013</option>
<option value="13/01/2013" >13/01/2013</option>
<option value="14/01/2013" >14/01/2013</option>
</select>
<input type="hidden" name="{%= CurrentQuestion.InputName()%}" value="{%= CurrentQuestion.InputValue()%}" />
Produce:
<input type="hidden" name="D1" value="12/01/2013" />
The input name is the letter T (for Time) follow by the id of the question: *T*_XX_
TXX=VAL
Example
T0=13%3A50%3A00
// Decoded version: T0=13:50:00
All of the following examples produce the same name/value pair T1=13:25:00 that will be recognised on the server-side.
<input type="text" name="{%= CurrentQuestion.InputName()%}" value="{%= CurrentQuestion.InputValue()%}" />
Produce:
<input type="text" name="T1" value="13:25:00" />
<input type="time" name="{%= CurrentQuestion.InputName()%}" value="{%= CurrentQuestion.InputValue()%}" ↩
min="{%= CurrentQuestion.MinDate.Format("HH:mm:ss")%}" max="{%= CurrentQuestion.MaxDate.Format("HH:mm:ss")%}" />
Produce:
<input type="time" name="T1" value="13:25:00" min="13:25:00" max="14:00:00" />
{% dim i
dim availableTime = {"13:25:00"; "13:50:00"; "14:00:00"}
dim rId
dim checked
For i = 1 To availableTime.Count %}
{% rId= CurrentQuestion.InputName() + "_" + i %}
{% checked = On(CurrentQuestion.Value.Format("HH:mm:ss") = availableTime[i], "checked=\"checked\"", "")%}
<input type="radio" name="{%= CurrentQuestion.InputName()%}" id="{%= rId%}" value="{%= availableTime[i]%} {%:= checked%} ↩
<label for="{%= rId%}">{%= availableTime[i]%}</label>
{% Next %}
Produce:
<input type="radio" name="T1" id="T1_1" value="13:25:00" checked="checked" /><label for="D1_1">12/01/2013</label>
<input type="radio" name="T1" id="T1_2" value="13:50:00" /><label for="T1_2">13:50:00</label>
<input type="radio" name="T1" id="T1_3" value="14:00:00" /><label for="T1_2">14:00:00</label>
<select name="{%= CurrentQuestion.InputName()%}">
{%
dim availableTime = {"13:25:00"; "13:50:00"; "14:00:00"}
dim i
dim selected
For i = 1 To availableTime.Count %}
{% selected = On(CurrentQuestion.Value.Format("HH:mm:ss") = availableTime[i], "selected=\"selected\"", "") %}
<option value="{%= availableTime[i] %}" {%:= selected%}>{%= availableTime[i]%}</option>
{% Next %}
</select>
Produce:
<select name="T1">
<option value="13:25:00" selected="selected">13:25:00</option>
<option value="13:50:00" >13:50:00</option>
<option value="14:00:00" >14:00:00</option>
</select>
<input type="hidden" name="{%= CurrentQuestion.InputName()%}" value="{%= CurrentQuestion.InputValue()%}" />
Produce:
<input type="hidden" name="T1" value="13:25:00" />
The date/time question should generate two inputs, one for the date and one for the time. It uses the format of the Date question and the Time question : *D*_XX_ and *T*_XX_
DXX=VAL&TXX=VAL
Example
D0=25%2F01%2F2013&T0=13%3A50%3A00
// Decoded version: D0=25/01/2013&T0=13:50:00
All of the following examples produce the same name/value pairs D1=25/01/2013&T1=13:25:00 that will be recognised on the server-side.
<input type="text" name="{%= CurrentQuestion.InputName("date")%}" value="{%= CurrentQuestion.InputValue("date")%}" />
<input type="text" name="{%= CurrentQuestion.InputName("time")%}" value="{%= CurrentQuestion.InputValue("time")%}" />
Produce:
<input type="text" name="D1" value="25/01/2013" />
<input type="text" name="T1" value="13:25:00" />
<input type="date" name="{%= CurrentQuestion.InputName("date")%}" value="{%= CurrentQuestion.InputValue("date")%}" ↩
min="{%= CurrentQuestion.MinDate.Format("dd/MM/yyyy")%}" max="{%= CurrentQuestion.MaxDate.Format("dd/MM/yyyy")%}" />
<input type="time" name="{%= CurrentQuestion.InputName("time")%}" value="{%= CurrentQuestion.InputValue("time")%}" ↩
min="{%= CurrentQuestion.MinDate.Format("HH:mm:ss")%}" max="{%= CurrentQuestion.MaxDate.Format("HH:mm:ss")%}" />
Produce:
<input type="date" name="D1" value="25/01/2013" min="25/01/2013" max="27/01/2013" />
<input type="time" name="T1" value="13:25:00" min="13:25:00" max="14:00:00" />
<select name="{%= CurrentQuestion.InputName("date")%}">
{%
dim i
dim maxCount = CurrentQuestion.MaxDate - CurrentQuestion.MinDate
dim currentDate = CurrentQuestion.MinDate
dim selected
For i = 0 To maxCount
currentDate = currentDate + i
selected= on(CurrentQuestion.Value = currentDate, "selected=\"selected\", "")
%}
<option value="{%= currentDate%}" {%:= selected%} />{%= currentDate%}</option>
{% Next %}
</select>
<select name="{%= CurrentQuestion.InputName("time")%}">
{%
dim availableTime = {"13:25:00"; "13:50:00"; "14:00:00"}
For i = 1 To availableTime.Count %}
{% selected = On(CurrentQuestion.Value.Format("HH:mm:ss") = availableTime[i], "selected=\"selected\"", "") %}
<option value="{%= availableTime[i] %}" {%:= selected%}>{%= availableTime[i]%}</option>
{% Next %}
</select>
Produce:
<select name="D1">
<option value="25/01/2013" selected="selected">25/01/2013</option>
<option value="26/01/2013" >26/01/2013</option>
<option value="27/01/2013" >27/01/2013</option>
</select>
<select name="T1">
<option value="13:25:00" selected="selected">13:25:00</option>
<option value="13:50:00" >13:50:00</option>
<option value="14:00:00" >14:00:00</option>
</select>
<input type="hidden" name="{%= CurrentQuestion.InputName("date")%}" value="{%= CurrentQuestion.InputValue("date")%}" />
<input type="hidden" name="{%= CurrentQuestion.InputName("time")%}" value="{%= CurrentQuestion.InputValue("time")%}" />
Produce:
<input type="hidden" name="D1" value="25/01/2013" />
<input type="hidden" name="T1" value="13:25:00" />
The input name is the letter U (for Unique) follow by the id of the question: *U*_XX_
UXX=YY
Example
U0=256
// The response with the id=256 is selected
All of the following examples produce the same name/value pair U1=256 that will be recognised on the server-side.
{% dim i
dim rId
dim checked
For i = 1 To CurrentQuestion.AvailableResponses.Count %}
{% rId = CurrentQuestion.InputName() + "_" + i %}
{% checked = On(CurrentQuestion.AvailableResponses[i].IsSelected, "checked=\"checked\"", "")%}
<input type="radio" name="{%= CurrentQuestion.InputName()%}" id="{%= rId%}" ↩
value="{%= CurrentQuestion.AvailableResponses[i].InputValue()%} {%:= checked%} /> ↩
<label for="{%= rId %}">{%= CurrentQuestion.AvailableResponses[i].Caption%}</label>
{% Next %}
Produce:
<input type="radio" name="U1" id="U1_1" value="256" checked="checked" /><label for="D1_1">Response A</label>
<input type="radio" name="U1" id="U1_2" value="257" /><label for="U1_2">Response B</label>
<input type="radio" name="U1" id="U1_3" value="258" /><label for="U1_3">Response C</label>
<select name="{%= CurrentQuestion.InputName()%}">
{%
dim i
dim selected
For i = 1 To CurrentQuestion.AvailableResponses.Count %}
{% selected = On(CurrentQuestion.AvailableResponses[i].IsSelected, "selected=\"selected\"", "") %}
<option value="{%= CurrentQuestion.AvailableResponses[i].InputValue() %}" {%:= selected%}> ↩
{%= CurrentQuestion.AvailableResponses[i].Caption%}</option>
{% Next %}
</select>
Produce:
<select name="U1">
<option value="256" selected="selected">Response A</option>
<option value="257" >Response B</option>
<option value="258" >Response C</option>
</select>
<input type="hidden" name="{%= CurrentQuestion.InputName()%}" value="{%= CurrentQuestion.InputValue()%}" />
Produce:
<input type="hidden" name="U1" value="256" />
The input name is the letter M (for Multiple) follow by the id of the question, follow by a space and the id of the response: *M*_XX_ YY. The value associated is always “on” which indicates that the response is selected. If the response (checkbox) is not selected the browser will not send the information.
MXX%20YY=on
Example
M25%20256=on
// Decoded version: M25 256=on
// The response with the id=256 is selected
All of the following examples produce the same name/value pairs M1 256=on&M1 257=on that will be recognised on the server-side.
{% dim i
dim rId
dim checked
For i = 1 To CurrentQuestion.AvailableResponses.Count %}
{% rId = CurrentQuestion.AvailableResponses[i].InputName().Replace(" ", "_") %}
{% checked = On(CurrentQuestion.AvailableResponses[i].IsSelected, "checked=\"checked\"", "")%}
<input type="checkbox" name="{%= CurrentQuestion.AvailableResponses[i].InputName()%}" id="{%= rId%}" {%:= checked%} /> ↩
<label for="{%= rId %}">{%= CurrentQuestion.AvailableResponses[i].Caption%}</label>
{% Next %}
Produce:
<input type="checkbox" name="M1 256" id="M1_256" checked="checked" /><label for="M1_256">Response A</label>
<input type="checkbox" name="M1 257" id="M1_257" checked="checked"/><label for="M1_257">Response B</label>
<input type="checkbox" name="M1 258" id="M1_258" /><label for="M1_258">Response C</label>
The input name is the letter R (for Ranking) follow by the id of the question, followed by a space and the id of the response: *R*_XX_ YY. The value associated with that response is the order of selection (numeric). Because it’s a ranking the values of the same XX question must be a sequence of successive numbers starting from 1 to the number of the selected answers.
RXX%20YY=VAL
Example
R25%20256=2
// Decoded version: M25 256=2
// The response with the id=256 is the second selected
All of the following examples produce the same name/value pairs R1 256=2&R1 257=1 that will be recognised on the server-side.
{% dim i
dim rId
For i = 1 To CurrentQuestion.AvailableResponses.Count %}
{% rId= CurrentQuestion.AvailableResponses[i].InputName("ranking").Replace(" ", "_") %}
<label for="{%= rId%}">{%= CurrentQuestion.AvailableResponses[i].Caption%}</label> ↩
<input type="text" name="{%= CurrentQuestion.AvailableResponses[i].InputName("ranking")%}" id="{%= rId%}" ↩
value="{%= CurrentQuestion.AvailableResponses[i].InputValue("ranking")%}" />
{% Next %}
Produce:
<label for="R1_256">Response A</label><input type="text" name="R1 256" id="R1_256" value="2"/>
<label for="R1_256">Response B</label><input type="text" name="R1 257" id="R1_257" value="1"/>
<label for="R1_256">Response C</label><input type="text" name="R1 258" id="R1_256" value=""/>
{% dim i
dim rId
dim maxValue = CurrentQuestion.MaxValue
For i = 1 To CurrentQuestion.AvailableResponses.Count %}
{% rId = CurrentQuestion.AvailableResponses[i].InputName("ranking").Replace(" ", "_") %}
<label for="{%= rId %}">{%= CurrentQuestion.AvailableResponses[i].Caption%}</label> ↩
<input type="number" name="{%= CurrentQuestion.AvailableResponses[i].InputName("ranking")%}" id="{%= rId%}" ↩
value="{%= CurrentQuestion.AvailableResponses[i].InputValue("ranking")%}" min="1" max="{%= maxValue%}" />
{% Next %}
Produce:
<label for="R1_256">Response A</label><input type="number" name="R1 256" id="R1_256" value="2" min="1" max="3"/>
<label for="R1_256">Response B</label><input type="number" name="R1 257" id="R1_257" value="1" min="1" max="3"/>
<label for="R1_256">Response C</label><input type="number" name="R1 258" id="R1_256" value="" min="1" max="3"/>
The input name is the letter L (for List) follow by the id of the question: *L*_XX_. The value associated are the ids of responses separated with the coma (YY,YY).
LXX=YY
LXX=YY%2CYY
Example:
L1=256
// The response with the id=256 is selected
L1=256%2C257%2C258
// Decoded version: L1=256,257,258
// The responses with the id 256, 257 and 258 are selected
All of the following examples produce the same name/value pairs L1=256,257 that will be recognised on the server-side.
<select name="{%= CurrentQuestion.InputName("list")%}" multiple="multiple">
{% dim i
dim selected
For i = 1 To CurrentQuestion.AvailableResponses.Count %}
{% selected = On(CurrentQuestion.AvailableResponses[i].IsSelected, "selected=\"selected\"", "") %}
<option value="{%= CurrentQuestion.AvailableResponses[i].InputValue()%}" {%:= selected %}> ↩
{%= CurrentQuestion.AvailableResponses[i].Caption%}</option>
{% Next %}
</select>
Produce:
<select name="L1" multiple="multiple">
<option value="256" selected="selected">Response A</option>
<option value="257" selected="selected">Response B</option>
<option value="258">Response C</option>
</select>
<input type="hidden" name="{%= CurrentQuestion.InputName("list")%}" value="{%= CurrentQuestion.InputValue()%}" />
Produce:
<input type="hidden" name="L1" value="256,257" />