@@ -44,8 +44,8 @@ error handling to forms. +LinedBuilder+ wraps each input element created by a call to a field helper in a div of CSS class +form_line+. It also gives it a label (by default, this contains the humanized name of the field) and, if an error exists, it provides a nested div within the +form_line+ of CSS class -+field_error+ and the div's class is changed to +form_line_with_errors+. More -details are below. ++field_error+ and the div's class is changed to +<tt>form_line with_errors</tt>. More details are below. A short example now. Assume there are three fields for a model -- `number', `date', and `name'. `name' is blank but should not be, and so has an error on @@ -60,7 +60,7 @@ it. The ERB code: Will yield the HTML output: <form ...> - <div class="form_line_with_errors"> + <div class="form_line with_errors"> <div class="field_error">Name should not be blank.</div> <label for="model_name">Name:</label> <input type="text" name="model[name]" id="model_name" value="" /> README @@ -18,13 +18,23 @@ module AwesomeFields # # When producing a field, the field is wrapped with a div whose CSS class is # +form_line+. If the field has errors, that class is instead - # +form_line_with_errors+. This div is, obviously, a block-level element by + # <tt>form_line with_errors</tt>. This div is, obviously, a block-level element by # default, but can be floated or what have you if needed. # # == Errors # # As mentioned above, if the field has an error, the wrapping div is given the - # +form_line_with_errors+ CSS class instead of the regular +form_line+ class. + # <tt>form_line with_errors</tt> CSS class instead of the regular +form_line+ class. + # Recommended CSS looks something like: + # + # form div.form_line { + # ... font, padding, margin, etc. + # } + # + # form div.form_line.with_errors { + # color: red; <!-- additional formatting for error fields --> + # } + # # Additionally, the error text is placed within the containing +form_line+ div # within its own div, whose class is +field_error+. # @@ -39,7 +49,7 @@ module AwesomeFields # # The resulting structure of a field with errors is: # - # <div class="form_line_with_errors"> + # <div class="form_line with_errors"> # <div class="field_error">Field should not be blank.</div> # # <label for="model_field">Field:</label> @@ -127,7 +137,7 @@ module AwesomeFields @template.content_tag( 'div', (err ? err : '') + label_tag( label, options ) + super, - :class => err ? 'form_line_with_errors' : 'form_line' ) + :class => err ? 'form_line with_errors' : 'form_line' ) end # Produces a submit button wrapped in a div of class +form_buttons+. The @@ -151,7 +161,7 @@ module AwesomeFields @template.content_tag 'div', (err ? err : '') + label_tag(attr, options) + content_gen.call + after, - :class => (err ? 'form_line_with_errors' : 'form_line') + :class => (err ? 'form_line with_errors' : 'form_line') end # Produces the appropriate label tag for the given attribute, including lib/awesome_fields/lined_builder.rb dac28408018d545fd90296ea3935eefa529fe1d6 James Rosen james.a.rosen@gmail.com http://github.com/Shadowfiend/awesome_fields/commit/210f29c25124c2b462cb8a01c7dfed5a9f410789 210f29c25124c2b462cb8a01c7dfed5a9f410789 2008-06-26T23:39:37-07:00 2008-06-26T23:39:37-07:00 switched div class name on error to 'form_line with_errors' to reduce duplication in CSS 362f5329f5a42518f5a31e78a8672adb7792a7dd James Rosen james.a.rosen@gmail.com