14 | | Django provides a representation of all the basic HTML widgets, plus some |
15 | | commonly used groups of widgets: |
16 | | |
17 | | .. class:: TextInput |
18 | | |
19 | | Text input: ``<input type='text' ...>`` |
20 | | |
21 | | .. class:: PasswordInput |
22 | | |
23 | | Password input: ``<input type='password' ...>`` |
24 | | |
25 | | Takes one optional argument: |
26 | | |
27 | | .. attribute:: PasswordInput.render_value |
28 | | |
29 | | Determines whether the widget will have a value filled in when the |
30 | | form is re-displayed after a validation error (default is ``False``). |
31 | | |
32 | | .. versionchanged:: 1.3 |
33 | | The default value for |
34 | | :attr:`~PasswordInput.render_value` was |
35 | | changed from ``True`` to ``False`` |
36 | | |
37 | | .. class:: HiddenInput |
38 | | |
39 | | Hidden input: ``<input type='hidden' ...>`` |
40 | | |
41 | | .. class:: MultipleHiddenInput |
42 | | |
43 | | Multiple ``<input type='hidden' ...>`` widgets. |
44 | | |
45 | | .. class:: FileInput |
46 | | |
47 | | File upload input: ``<input type='file' ...>`` |
48 | | |
49 | | .. class:: ClearableFileInput |
50 | | |
51 | | .. versionadded:: 1.3 |
52 | | |
53 | | File upload input: ``<input type='file' ...>``, with an additional checkbox |
54 | | input to clear the field's value, if the field is not required and has |
55 | | initial data. |
56 | | |
57 | | .. class:: DateInput |
58 | | |
59 | | Date input as a simple text box: ``<input type='text' ...>`` |
60 | | |
61 | | Takes one optional argument: |
62 | | |
63 | | .. attribute:: DateInput.format |
64 | | |
65 | | The format in which this field's initial value will be displayed. |
66 | | |
67 | | If no ``format`` argument is provided, the default format is ``'%Y-%m-%d'``. |
68 | | |
69 | | .. class:: DateTimeInput |
70 | | |
71 | | Date/time input as a simple text box: ``<input type='text' ...>`` |
72 | | |
73 | | Takes one optional argument: |
74 | | |
75 | | .. attribute:: DateTimeInput.format |
76 | | |
77 | | The format in which this field's initial value will be displayed. |
78 | | |
79 | | If no ``format`` argument is provided, the default format is ``'%Y-%m-%d |
80 | | %H:%M:%S'``. |
81 | | |
82 | | .. class:: TimeInput |
83 | | |
84 | | Time input as a simple text box: ``<input type='text' ...>`` |
85 | | |
86 | | Takes one optional argument: |
87 | | |
88 | | .. attribute:: TimeInput.format |
89 | | |
90 | | The format in which this field's initial value will be displayed. |
91 | | |
92 | | If no ``format`` argument is provided, the default format is ``'%H:%M:%S'``. |
93 | | |
94 | | .. class:: Textarea |
95 | | |
96 | | Text area: ``<textarea>...</textarea>`` |
97 | | |
98 | | .. class:: CheckboxInput |
99 | | |
100 | | Checkbox: ``<input type='checkbox' ...>`` |
101 | | |
102 | | Takes one optional argument: |
103 | | |
104 | | .. attribute:: CheckboxInput.check_test |
105 | | |
106 | | A callable that takes the value of the CheckBoxInput |
107 | | and returns ``True`` if the checkbox should be checked for |
108 | | that value. |
109 | | |
110 | | .. class:: Select |
111 | | |
112 | | Select widget: ``<select><option ...>...</select>`` |
113 | | |
114 | | Requires that your field provides :attr:`~Field.choices`. |
115 | | |
116 | | .. class:: NullBooleanSelect |
117 | | |
118 | | Select widget with options 'Unknown', 'Yes' and 'No' |
119 | | |
120 | | .. class:: SelectMultiple |
121 | | |
122 | | Select widget allowing multiple selection: ``<select |
123 | | multiple='multiple'>...</select>`` |
124 | | |
125 | | Requires that your field provides :attr:`~Field.choices`. |
126 | | |
127 | | .. class:: RadioSelect |
128 | | |
129 | | A list of radio buttons: |
130 | | |
131 | | .. code-block:: html |
132 | | |
133 | | <ul> |
134 | | <li><input type='radio' ...></li> |
135 | | ... |
136 | | </ul> |
137 | | |
138 | | Requires that your field provides :attr:`~Field.choices`. |
139 | | |
140 | | .. class:: CheckboxSelectMultiple |
141 | | |
142 | | A list of checkboxes: |
143 | | |
144 | | .. code-block:: html |
145 | | |
146 | | <ul> |
147 | | <li><input type='checkbox' ...></li> |
148 | | ... |
149 | | </ul> |
150 | | |
151 | | .. class:: MultiWidget |
152 | | |
153 | | Wrapper around multiple other widgets |
154 | | |
155 | | .. class:: SplitDateTimeWidget |
156 | | |
157 | | Wrapper around two widgets: ``DateInput`` for the date, and ``TimeInput`` |
158 | | for the time. |
159 | | |
160 | | Takes two optional arguments, ``date_format`` and ``time_format``, which |
161 | | work just like the ``format`` argument for ``DateInput`` and ``TimeInput``. |
162 | | |
163 | | .. currentmodule:: django.forms.extras.widgets |
164 | | |
165 | | .. class:: SelectDateWidget |
166 | | |
167 | | Wrapper around three select widgets: one each for month, day, and year. |
168 | | Note that this widget lives in a separate file from the standard widgets. |
169 | | |
170 | | Takes one optional argument: |
171 | | |
172 | | .. attribute:: List.years |
173 | | |
174 | | An optional list/tuple of years to use in the "year" select box. |
175 | | The default is a list containing the current year and the next 9 years. |
176 | | |
177 | | .. code-block:: python |
178 | | |
179 | | from django.forms.extras.widgets import SelectDateWidget |
180 | | |
181 | | date = forms.DateField(widget=SelectDateWidget()) |
182 | | |
| 35 | |
| 36 | Setting arguments for widgets |
| 37 | ----------------------------- |
| 38 | |
| 39 | Some widgets take over arguments from the fields they represent, for example |
| 40 | :class:`RadioSelect` or :class:`MultipleChoiceField` will use the choices of |
| 41 | the underlying field. Some widgets have optional extra arguments; they can be |
| 42 | set when defining the widget on the field. The reference below describes which |
| 43 | options can be set. |
| 44 | |
| 45 | In this example, the years attribute is set for a |
| 46 | :class:`django.forms.widgets.extras.SelectDateWidget`: :: |
| 47 | |
| 48 | YEAR_CHOICES = ('2010', '2009',) |
| 49 | RADIO_CHOICES = (('1','Radio 1',), ('2','Radio 2',),) |
| 50 | CHECKBOX_CHOICES = (('1','The first choice',), ('2','The Second Choice',),) |
| 51 | |
| 52 | class SimpleForm(forms.Form): |
| 53 | radio = forms.ChoiceField(widget=RadioSelect, choices=RADIO_CHOICES) |
| 54 | checkboxes = forms.MultipleChoiceField(required=False, |
| 55 | widget=CheckboxSelectMultiple, choices=CHECKBOX_CHOICES) |
| 56 | date = forms.DateField(widget=SelectDateWidget(years=YEAR_CHOICES)) |
| 57 | |
| 58 | |
| 59 | Widgets with choices |
| 60 | ^^^^^^^^^^^^^^^^^^^^ |
| 61 | |
| 62 | A couple of widgets deal with choices; these are mainly based on the |
| 63 | :class:`Select` widget and in most cases "owned" by a field based on |
| 64 | :class:`ChoiceField`. The :class:`ChoiceField` dictates what the choices are |
| 65 | and resets the choices on the widget everytime they get changed on the field. |
| 66 | |
| 67 | Widgets which offer a ``choices`` attribute can however be used with fields |
| 68 | which are not based on choice, such as a :class:`TextField`, but it is |
| 69 | recommended to use a :class:`ChoiceField`-based field when the choices are |
| 70 | inherent to the model and not just the representational widget. |
| 71 | |
| 124 | |
| 125 | Built-in widgets |
| 126 | ---------------- |
| 127 | |
| 128 | Django provides a representation of all the basic HTML widgets, plus some |
| 129 | commonly used groups of widgets: |
| 130 | |
| 131 | .. class:: Widget |
| 132 | |
| 133 | This abstract class cannot be rendered, but provides the basic attribute :attr:`~Widget.attrs`. |
| 134 | |
| 135 | .. attribute:: Widget.attrs |
| 136 | |
| 137 | A dictionary containing HTML attributes to be set on the rendered widget. |
| 138 | |
| 139 | .. code-block:: python |
| 140 | |
| 141 | >>> name = forms.TextInput(attrs={'size': 10, 'title': 'Your name',}) |
| 142 | >>> name.render('name', 'A name') |
| 143 | u'<input title="Your name" type="text" name="name" value="A name" size="10" />' |
| 144 | |
| 145 | |
| 146 | .. class:: TextInput |
| 147 | |
| 148 | Text input: ``<input type='text' ...>`` |
| 149 | |
| 150 | .. class:: PasswordInput |
| 151 | |
| 152 | Password input: ``<input type='password' ...>`` |
| 153 | |
| 154 | Takes one optional argument: |
| 155 | |
| 156 | .. attribute:: PasswordInput.render_value |
| 157 | |
| 158 | Determines whether the widget will have a value filled in when the |
| 159 | form is re-displayed after a validation error (default is ``False``). |
| 160 | |
| 161 | .. versionchanged:: 1.3 |
| 162 | The default value for |
| 163 | :attr:`~PasswordInput.render_value` was |
| 164 | changed from ``True`` to ``False`` |
| 165 | |
| 166 | .. class:: HiddenInput |
| 167 | |
| 168 | Hidden input: ``<input type='hidden' ...>`` |
| 169 | |
| 170 | .. class:: MultipleHiddenInput |
| 171 | |
| 172 | Multiple ``<input type='hidden' ...>`` widgets. |
| 173 | |
| 174 | A widget that handles multiple hidden widgets for fields that have a list of values. |
| 175 | |
| 176 | .. attribute:: MultipleHiddenInput.choices |
| 177 | |
| 178 | This attribute is optional when the field does not have a :attr:`~Field.choices` |
| 179 | attribute. If it does, it will override anything you set here when the attribute |
| 180 | is updated on the :class:`Field`. |
| 181 | |
| 182 | .. class:: FileInput |
| 183 | |
| 184 | File upload input: ``<input type='file' ...>`` |
| 185 | |
| 186 | .. class:: ClearableFileInput |
| 187 | |
| 188 | .. versionadded:: 1.3 |
| 189 | |
| 190 | File upload input: ``<input type='file' ...>``, with an additional checkbox |
| 191 | input to clear the field's value, if the field is not required and has |
| 192 | initial data. |
| 193 | |
| 194 | .. class:: DateInput |
| 195 | |
| 196 | Date input as a simple text box: ``<input type='text' ...>`` |
| 197 | |
| 198 | Takes one optional argument: |
| 199 | |
| 200 | .. attribute:: DateInput.format |
| 201 | |
| 202 | The format in which this field's initial value will be displayed. |
| 203 | |
| 204 | If no ``format`` argument is provided, the default format is the first |
| 205 | format found in :setting:`DATE_INPUT_FORMATS`. |
| 206 | |
| 207 | .. class:: DateTimeInput |
| 208 | |
| 209 | Date/time input as a simple text box: ``<input type='text' ...>`` |
| 210 | |
| 211 | Takes one optional argument: |
| 212 | |
| 213 | .. attribute:: DateTimeInput.format |
| 214 | |
| 215 | The format in which this field's initial value will be displayed. |
| 216 | |
| 217 | If no ``format`` argument is provided, the default format is the first |
| 218 | format found in :setting:`DATETIME_INPUT_FORMATS`. |
| 219 | |
| 220 | .. class:: TimeInput |
| 221 | |
| 222 | Time input as a simple text box: ``<input type='text' ...>`` |
| 223 | |
| 224 | Takes one optional argument: |
| 225 | |
| 226 | .. attribute:: TimeInput.format |
| 227 | |
| 228 | The format in which this field's initial value will be displayed. |
| 229 | |
| 230 | If no ``format`` argument is provided, the default format is the first |
| 231 | format found in :setting:`TIME_INPUT_FORMATS`. |
| 232 | |
| 233 | .. class:: Textarea |
| 234 | |
| 235 | Text area: ``<textarea>...</textarea>`` |
| 236 | |
| 237 | .. class:: CheckboxInput |
| 238 | |
| 239 | Checkbox: ``<input type='checkbox' ...>`` |
| 240 | |
| 241 | Takes one optional argument: |
| 242 | |
| 243 | .. attribute:: CheckboxInput.check_test |
| 244 | |
| 245 | A callable that takes the value of the CheckBoxInput |
| 246 | and returns ``True`` if the checkbox should be checked for |
| 247 | that value. |
| 248 | |
| 249 | .. class:: Select |
| 250 | |
| 251 | Select widget: ``<select><option ...>...</select>`` |
| 252 | |
| 253 | .. attribute:: Select.choices |
| 254 | |
| 255 | This attribute is optional when the field does not have a :attr:`~Field.choices` |
| 256 | attribute. If it does, it will override anything you set here when the attribute |
| 257 | is updated on the :class:`Field`. |
| 258 | |
| 259 | .. class:: NullBooleanSelect |
| 260 | |
| 261 | Select widget with options 'Unknown', 'Yes' and 'No' |
| 262 | |
| 263 | .. class:: SelectMultiple |
| 264 | |
| 265 | Similar to :class:`Select`, but allows multiple selection: |
| 266 | ``<select multiple='multiple'>...</select>`` |
| 267 | |
| 268 | .. class:: RadioSelect |
| 269 | |
| 270 | Similar to :class:`Select`, but rendered as a list of radio buttons: |
| 271 | |
| 272 | .. code-block:: html |
| 273 | |
| 274 | <ul> |
| 275 | <li><input type='radio' ...></li> |
| 276 | ... |
| 277 | </ul> |
| 278 | |
| 279 | .. class:: CheckboxSelectMultiple |
| 280 | |
| 281 | Similar to :class:`SelectMultiple`, but rendered as a list of check buttons: |
| 282 | |
| 283 | .. code-block:: html |
| 284 | |
| 285 | <ul> |
| 286 | <li><input type='checkbox' ...></li> |
| 287 | ... |
| 288 | </ul> |
| 289 | |
| 290 | .. class:: MultiWidget |
| 291 | |
| 292 | Wrapper around multiple other widgets. |
| 293 | |
| 294 | Its ``render`` method is different than other widgets', because it has to |
| 295 | figure out how to split a single value for display in multiple widgets. |
| 296 | The ``value`` argument can be one of two things: |
| 297 | |
| 298 | * A list. |
| 299 | * A normal value (e.g., a string) that has been "compressed" from |
| 300 | a list of values. |
| 301 | |
| 302 | In the second case -- i.e., if the value is NOT a list -- render() will |
| 303 | first "decompress" the value into a list before rendering it. It does so by |
| 304 | calling the decompress() method, which MultiWidget subclasses must |
| 305 | implement. This method takes a single "compressed" value and returns a |
| 306 | list. |
| 307 | |
| 308 | When render() does its HTML rendering, each value in the list is rendered |
| 309 | with the corresponding widget -- the first value is rendered in the first |
| 310 | widget, the second value is rendered in the second widget, etc. |
| 311 | |
| 312 | Subclasses may implement format_output(), which takes the list of rendered |
| 313 | widgets and returns a string of HTML that formats them any way you'd like. |
| 314 | |
| 315 | You'll probably want to use this class with :class:`MultiValueField`. |
| 316 | |
| 317 | .. attribute:: widgets |
| 318 | |
| 319 | An iterable containing the widgets needed. |
| 320 | |
| 321 | .. class:: SplitDateTimeWidget |
| 322 | |
| 323 | Wrapper (using :class:`MultiWidget`) around two widgets: :class:`DateInput` |
| 324 | for the date, and :class:`TimeInput` for the time. |
| 325 | |
| 326 | ``SplitDateTimeWidget`` has two optional attributes: |
| 327 | |
| 328 | .. attribute:: SplitDateTimeWidget.date_format |
| 329 | |
| 330 | Similar to :attr:`DateInput.format` |
| 331 | |
| 332 | .. attribute:: SplitDateTimeWidget.time_format |
| 333 | |
| 334 | Similar to :attr:`TimeInput.format` |
| 335 | |
| 336 | |
| 337 | .. class:: SplitHiddenDateTimeWidget |
| 338 | |
| 339 | Similar to :class:`SplitDateTimeWidget`, but uses :class:`HiddenInput` for |
| 340 | both date and time. |
| 341 | |
| 342 | .. currentmodule:: django.forms.widgets.extras |
| 343 | |
| 344 | .. class:: SelectDateWidget |
| 345 | |
| 346 | Wrapper around three :class:`~django.forms.Select` widgets: one each for month, day, and year. |
| 347 | Note that this widget lives in a separate file from the standard widgets. |
| 348 | |
| 349 | Takes one optional argument: |
| 350 | |
| 351 | .. attribute:: SelectDateWidget.years |
| 352 | |
| 353 | An optional list/tuple of years to use in the "year" select box. |
| 354 | The default is a list containing the current year and the next 9 years. |