Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Newer
Older
100644 123 lines (83 sloc) 4.342 kb
3c1a92d @airblade First draft.
authored
1 AirBuddFormBuilder
2 ==================
3
afe4571 @airblade Update README with deprecation notice.
authored
4 *Please note I am no longer working on this. It did the job admirably for a long time, but I now use [Simple Form](https://github.com/plataformatec/simple_form) instead.*
5
9831cfa @airblade Fixed up formatting.
authored
6 A form builder that generates semantic HTML as advocated by Andy Budd in [CSS Mastery][1].
3c1a92d @airblade First draft.
authored
7
9831cfa @airblade Fixed up formatting.
authored
8 It generates [Wufoo-style][2] buttons and links for submitting the form, cancelling it, etc. These buttons and links use several icons from the [FAMFAMFAM set][3]. You can choose not to use them if you don't want to.
811aa55 @airblade Generates Wufoo-style buttons and links.
authored
9
25b3387 @airblade Better achievement of HAML compatability.
authored
10 [1]: http://www.cssmastery.com
11 [2]: http://particletree.com/features/rediscovering-the-button-element/
12 [3]: http://famfamfam.com/lab/icons/silk/
817163f @airblade Added to do list.
authored
13
a46e56a @airblade Moved feedback note to make it more visible.
authored
14 Please send feedback to boss@airbladesoftware.com.
15
3c1a92d @airblade First draft.
authored
16
ae8275d @airblade Works with HAML.
authored
17 HAML
18 ====
9831cfa @airblade Fixed up formatting.
authored
19 Thanks to [David Baldwin][4], this form builder can be used with HAML.
25b3387 @airblade Better achievement of HAML compatability.
authored
20
21 [4]: http://www.baldwindigital.net
ae8275d @airblade Works with HAML.
authored
22
23
24 ERB Example
25 ===========
3c1a92d @airblade First draft.
authored
26
27 app/views/projects/new.html.erb:
28
9831cfa @airblade Fixed up formatting.
authored
29 <% airbudd_form_for @project do |f| %>
5cde2bd @airblade Fixed typo in ERB example.
authored
30 <%= f.text_field :title, :required => true, :label => "Article's Title" %>
9831cfa @airblade Fixed up formatting.
authored
31 <% f.buttons do |b| %>
32 <%= b.save %>
33 <%= b.cancel :url => projects_path %>
34 <% end %>
811aa55 @airblade Generates Wufoo-style buttons and links.
authored
35 <% end %>
3c1a92d @airblade First draft.
authored
36
82ef6f8 @airblade Added an example.
authored
37 This renders:
38
9831cfa @airblade Fixed up formatting.
authored
39 <form ...> <!-- standard Rails form element -->
40 <p class="text">
41 <label for="article_title">Article's Title:
42 <em class="required">(required)</em>
43 </label>
44 <input id="article_title" name="article[title]" type="text" value=""/>
45 </p>
46 <div class="buttons">
47 <button type="submit" class="positive"><img src="/images/icons/tick.png" alt=""/> Save</button>
48 <a href="/projects"><img src="/images/icons.pencil.png" alt=""/> Cancel</a>
49 </div>
50 </form>
51
52 And if the field's value is invalid:
53
54 <p class="error text">
811aa55 @airblade Generates Wufoo-style buttons and links.
authored
55 <label for="article_title">Article's Title:
56 <em class="required">(required)</em>
9831cfa @airblade Fixed up formatting.
authored
57 <span class="feedback">can't be blank</span>
811aa55 @airblade Generates Wufoo-style buttons and links.
authored
58 </label>
59 <input id="article_title" name="article[title]" type="text" value=""/>
60 </p>
82ef6f8 @airblade Added an example.
authored
61
62 See Mr Budd's good book for discussion of the HTML and the CSS to go with it.
63
3c1a92d @airblade First draft.
authored
64
09a6529 @airblade Added automatic detection of mandatory fields by borrowing Dan Webb's
authored
65 Required fields
66 ===============
67
68 Thanks to Bill, the form builder automatically detects required fields (by looking for :validates_presence_of in the model) and marks them up appropriately.
69
70
14afaa1 @airblade Made configurable on an app-wide basis and per form.
authored
71 Configuration
72 =============
73
ccde055 @airblade Fixed code formatting in README and added credit to Dan Webb.
authored
74 Thanks to Dan Webb, whose [Enhanced Form Builder](http://svn.danwebb.net/external/rails/plugins/enhanced_form_builder/lib/enhanced_form_builder/form_builder.rb) configuration I borrowed.
75
14afaa1 @airblade Made configurable on an app-wide basis and per form.
authored
76 You can configure the form builder at three levels: app-wide, per-form, and per-field. The per-field configuration differs slightly from the other two.
77
78 * App-wide:
79
80 config/initializers/form_builder.rb:
81
82 AirBlade::AirBudd::FormBuilder.default_options.merge!({
83 :required_signifier => '*',
84 :label_suffix => '',
85 })
86
ccde055 @airblade Fixed code formatting in README and added credit to Dan Webb.
authored
87 * Per form:
14afaa1 @airblade Made configurable on an app-wide basis and per form.
authored
88
d3b07ee @airblade Trying to have code blocks formatted.
authored
89 In your form:
90
91 - airbudd_form_for @member do |f|
92 - f.required_signifier = '*'
93 = f.text_field :name
14afaa1 @airblade Made configurable on an app-wide basis and per form.
authored
94
95 * Per field:
96
d3b07ee @airblade Trying to have code blocks formatted.
authored
97 On a form field:
98
99 = f.text_field :name, :required => true, :suffix => ''
14afaa1 @airblade Made configurable on an app-wide basis and per form.
authored
100
101 See the comments in the form builder's code for the exact configuration options available.
102
103
817163f @airblade Added to do list.
authored
104 To Do
105 =====
106
b9875cb @airblade Reminder to use Web forms design guidelines.
authored
107 * Incorporate cxpartners' excellent [Web forms design guidelines](http://www.cxpartners.co.uk/thoughts/web_forms_design_guidelines_an_eyetracking_study.htm).
488f445 @airblade Fixed formatting.
authored
108 * Fix `country_select` so it handles priority countries and options. It's currently broken.
109 * Wrapper for `options_group_from_collection_for_select`.
7eb7244 @airblade Added TODO.
authored
110 * DRY way to show consistent form links, e.g. edit, outside a form.
488f445 @airblade Fixed formatting.
authored
111 - include `link_to_function`, `link_to_remote`, etc.
112 - Cf `AirBlade::AirBudd::FormHelper#link_to_form`.
4d10651 @airblade Added a comment to todos.
authored
113 - Do we need to wrap buttons/links in a div? (Probably semantically good to do so?)
f01879a @airblade Added note in TODOs about read-only fields, based on Ryan Tomayko's exce...
authored
114 * Two read-only field helpers: one for within a form, containing the value so it can be submitted, and one for the 'show' page, so we can use the same markup and CSS (c.f. http://tomayko.com/writings/administrative-debris)..
7eb7244 @airblade Added TODO.
authored
115 * Example CSS:
15dc116 @airblade Minor tweaks.
authored
116 - for Wufoo-style buttons and links.
117 - for CSS Mastery XHTML.
7eb7244 @airblade Added TODO.
authored
118 * Summary error messages.
488f445 @airblade Fixed formatting.
authored
119 * Consider how to handle multiple actions, e.g. 'save & create another', 'save & keep editing'. See Brandon Keepers's [with_action plugin](http://opensoul.org/2007/7/16/handling-forms-with-multiple-buttons).
817163f @airblade Added to do list.
authored
120
121
122 Copyright (c) 2007 Andrew Stewart, released under the MIT license.
Something went wrong with that request. Please try again.