Skip to content

Form Editing

edjw edited this page Sep 27, 2019 · 27 revisions

Currently, the markup for the form contained in a slide is contained within the slide body itself.

Slide content allows the use of placeholders for generating some form elements.

Text areas

[--answer--]

Renders a single textarea for long text answers.

[--multiple-answer-0--] ... [--multiple-answer-9--]

Example: slide 1.3 in original Alidade content (sort of)

These placeholders can be used to render multiple textareas in a single slide. Note that the counters must be sequential.

Radio buttons

Example: slide 2.6 in original Alidade content

Radio buttons are added with the [--radio] macro.

There are two parameters:

  • symbolic name
  • display title
[--radio|<value>|<title>--]

e.g
[--radio|option1|Choose Option 1--]
<div class="row">
    <div class="col-md-4">
       [--radio|option1|My Option 1--]
    </div>
    <div class="col-md-4">
       [--radio|option2|My Option 2--]
    </div>
</div>

The first parameter (option1) is the value saved to the database.

The column widths are standard bootstrap. col-md-x should total 12 for each row.

Option checkboxes

Example: slide 4.1

[--check|<name>|<title>--]
<ul>
    <li>
       [--check|answer[1]|Advising on how to choose or use a tool--]
    </li>
    <li>
       [--check|answer[2]|Building a tool--]
    </li>
    <li>
       [--check|answer[2]|Help adapting an existing tool--]
    </li>
</ul>

name should be set to answer[x] where x increases sequentially. Options are presented in a list.

Saving checkbox answers requires support to be written in to the slide save code.

Optional selection panels within pages

Similar to slide 1.3 in the original alidade content, single-option buttons can be used to show or hide information regions (and form elements) in a slide.

[--choicebutton|<name>|<title>--]

Creates a button with the internal identifier name and the title title. Multiple buttons can be placed on the same line in the text editor to show a row of buttons.

[--choicepanel|<name>--]
(some content)
[--endchoicepanel--]

Slide content enclosed within a [--choicepanel--] will only be shown when a button with the same name identifier is selected. The choice of button is persisted when the user moves between slides, and the corresponding content is shown when they revisit a slide.

Sideboxes

[--box|<type>--]content[--endbox--]

You can create boxes that can go pretty much everywhere you want. Supported values for type

Light blue — [--box|questions--]content[--endbox--]

Grey — [--box|example--]content[--endbox--]

Green — [--box|casestudy--]content[--endbox--]

Purple — [--box|research--]content[--endbox--]

Orange — [--box|tips--]content[--endbox--]

Clone this wiki locally