-
Notifications
You must be signed in to change notification settings - Fork 2k
/
form.html
143 lines (123 loc) · 6.92 KB
/
form.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
{#
Creates all the markup required for an input element. Handles matching labels to
inputs, error messages and other useful elements.
name - The name of the form parameter.
id - The id to use on the input and label. Convention is to prefix with 'field-'.
label - The human readable label.
value - The value of the input. The alternative is to pass in the data dict
which will use the name key as the value.
placeholder - Some placeholder text.
type - The type of input eg. email, url, date (default: text).
data - The data dict, used to look up the value using the name.
errors - The errors dict, used to look up the error using the name.
classes - An array of classes to apply to the control-group.
Examples:
{% import form from 'macros/form.html' %}
{{ form.input('title', label=_('Title'), data=data, errors=errors) }}
#}
{% macro input(name, id='', label='', value='', placeholder='', type='text', data={}, errors={}, classes=[]) %}
<div class="control-group{% if classes %} {{ classes | join(' ') }}{% endif %}">
<label class="control-label" for="{{ id or name }}">{{ label or name }}</label>
<div class="controls">
<input id="{{ id or name }}" name="{{ name }}" value="{{ data[name] or value | e }}" placeholder="{{ placeholder }}" />
{% if errors[name] %}<span class="error-block">{{ errors[name] }}</span>{% endif %}
</div>
</div>
{% endmacro %}
{#
Creates all the markup required for an select element. Handles matching labels to
inputs and error messages.
name - The name of the form parameter.
id - The id to use on the input and label. Convention is to prefix with 'field-'.
label - The human readable label.
options - A dict of value/label pairs to be used as <options>.
selected - The value of the selected <option>.
errors - The errors dict, used to look up the error using the name.
classes - An array of classes to apply to the control-group.
Examples:
{% import form from 'macros/form.html' %}
{{ form.select('year', label=_('Year'), options={2010: 2010, 2011: 2011}, selected=2011, errors=errors) }}
#}
{% macro select(name, id='', label='', options='', selected='', errors={}, classes=[]) %}
<div class="control-group{% if classes %} {{ classes | join(' ') }}{% endif %}">
<label class="control-label" for="{{ id or name }}">{{ label or name }}</label>
<div class="controls">
<select id="{{ id or name }}" name="{{ name }}">
{% for value, text in options.iteritems() %}
<option value="{{ value }}"{% if value == selected %} selected{% endif %}>{{ text }}</option>
{% endfor %}
</select>
{% if errors[name] %}<span class="error-block">{{ errors[name] }}</span>{% endif %}
</div>
</div>
{% endmacro %}
{#
Creates all the markup required for a Markdown textarea element. Handles
matching labels to inputs, selected item and error messages.
name - The name of the form parameter.
id - The id to use on the input and label. Convention is to prefix with 'field-'.
label - The human readable label.
value - The value of the input. The alternative is to pass in the data dict
which will use the name key as the value.
placeholder - Some placeholder text.
data - The data dict, used to look up the value using the name.
errors - The errors dict, used to look up the error using the name.
classes - An array of classes to apply to the control-group.
Examples:
{% import form from 'macros/form.html' %}
{{ form.markdown('desc', id='field-description', label=_('Description'), data=data, errors=errors) }}
#}
{% macro markdown(name, id='', label='', value='', placeholder='', data={}, errors={}, classes=[]) %}
<div class="control-group control-full{% if classes %} {{ classes | join(' ') }}{% endif %}">
<label class="control-label" for="{{ id or name }}">{{ label or name }}</label>
<div class="controls editor">
<textarea id="{{ id or name }}" name="{{ name }}" cols="20" rows="5" placeholder="{{ placeholder }}">{{ data[name] or value | e }}</textarea>
<span class="info-block">You can use <a href="http://daringfireball.net/projects/markdown/syntax">Markdown</a> editing here</span>
{% if errors[name] %}<span class="error-block">{{ errors[name] }}</span>{% endif %}
</div>
</div>
{% endmacro %}
{#
Creates all the markup required for an input element with a prefixed segment.
These are useful for showing url slugs and other fields where the input
information forms only part of the saved data.
name - The name of the form parameter.
id - The id to use on the input and label. Convention is to prefix with 'field-'.
label - The human readable label.
prepend - The text that will be prepended before the input.
value - The value of the input. The alternative is to pass in the data dict
which will use the name key as the value.
placeholder - Some placeholder text.
data - The data dict, used to look up the value using the name.
errors - The errors dict, used to look up the error using the name.
classes - An array of classes to apply to the control-group.
Examples:
{% import form from 'macros/form.html' %}
{{ form.prepend('slug', id='field-slug', prepend='/dataset/', label=_('Slug'), data=data, errors=errors) }}
#}
{% macro prepend(name, id='', label='', prepend='', value='', placeholder='', type='text', data={}, errors={}, classes=[]) %}
<div class="control-group{% if classes %} {{ classes | join(' ') }}{% endif %}">
<label class="control-label" for="{{ id or name }}">{{ label or name }}</label>
<div class="controls">
<div class="input-prepend">
{% if prepend %}<span class="add-on">{{ prepend }}</span>{%- endif -%}
<input id="{{ id or name }}" name="{{ name }}" value="{{ data[name] or value | e }}" placeholder="{{ placeholder }}" />
</div>
{% if errors[name] %}<span class="error-block">{{ errors[name] }}</span>{% endif %}
</div>
</div>
{% endmacro %}
{% macro keyvalue(names=(), id="", label="", values=(), placeholders=(), error="", classes=[]) %}
<div class="control-group">
<label class="control-label" for="{{ id or names[0] }}-key">{{ label or _('Custom') }}</label>
<div class="controls">
<div class="input-prepend">
<label for="{{ id or names[0] }}-key" class="add-on">Key</label><input id="{{ id or names[0] }}-key" name="{{ names[0] }}" value="{{ values[0] | e }}" placeholder="{{ placeholders[0] }}" />
<label for="{{ id or names[1] }}-value" class="add-on">Value</label><input id="{{ id or names[1] }}-value" name="{{ names[1] }}" value="{{ values[1] | e }}" placeholder="{{ placeholders[1] }}" />
<label class="checkbox" for="{{ id or names[2] }}-remove">
<input type="checkbox" id="{{ id or names[2] }}-remove" name="{{ names[2] }}"{% if values[2] %} checked{% endif %} /> {{ _('Remove') }}
</label>
</div>
</div>
</div>
{% endmacro %}