Skip to content
Browse files

Merge pull request #13 from whardeman/36781e6fde078e3e6c0609773e282b3…

…3045c9bfb

Convenient addition of extraClasses in Field definitions
  • Loading branch information...
2 parents 9cf5d8f + 36781e6 commit d37086ae5ac43be2eb6318708e16805af88022f6 @insin committed Jun 2, 2012
Showing with 20 additions and 2 deletions.
  1. +17 −0 README.rst
  2. +2 −1 lib/fields.js
  3. +1 −1 lib/forms.js
View
17 README.rst
@@ -119,6 +119,23 @@ Here's a quick guide to getting started with newforms.
var formSet = new ArticleFormSet()
+* Custom row styling: ``requiredCssClass`` and ``errorCssClass`` can be added to
+ any form and the classes will be applied to each matching row in the form
+ output. To add extra CSS classes to a particular row, pass the
+ ``extraClasses`` property in the field definition. All of the above are added
+ to the class attribute of the **containing** element, e.g., ``<tr>``, ``<li>``
+ or ``<p>``::
+
+ var PostForm = forms.Form.extend({
+ // Fields
+ postTitle : forms.CharField({maxLength: 100})
+ , postBody : forms.CharField({extraClasses: 'larger island'})
+ , allowComments : forms.BooleanField({required: false})
+ // CSS settings
+ , requiredCssClass : 'required' // A class to style required fields
+ , errorCssClass : 'error' // A class to style fields with errors
+ })
+
* The API is largely consistent with Django's API, with the following
rules of thumb for converting between the two:
View
3 lib/fields.js
@@ -27,13 +27,14 @@ var Field = Concur.extend({
kwargs = object.extend({
required: true, widget: null, label: null, initial: null,
helpText: null, errorMessages: null, showHiddenInitial: false,
- validators: []
+ validators: [], extraClasses: null
}, kwargs)
this.required = kwargs.required
this.label = kwargs.label
this.initial = kwargs.initial
this.showHiddenInitial = kwargs.showHiddenInitial
this.helpText = kwargs.helpText || ''
+ this.extraClasses = kwargs.extraClasses
var widget = kwargs.widget || this.widget
if (!(widget instanceof Widget)) {
View
2 lib/forms.js
@@ -247,7 +247,7 @@ BoundField.prototype.labelTag = function(kwargs) {
* Returns a string of space-separated CSS classes for this field.
*/
BoundField.prototype.cssClasses = function(extraClasses) {
- extraClasses = extraClasses || null
+ extraClasses = extraClasses || this.field.extraClasses
if (extraClasses !== null && is.Function(extraClasses.split)) {
extraClasses = extraClasses.split()
}

0 comments on commit d37086a

Please sign in to comment.
Something went wrong with that request. Please try again.