GithubHelp home page GithubHelp logo

robdimarco / semantic_form_builder Goto Github PK

View Code? Open in Web Editor NEW

This project forked from glenngillen/semantic_form_builder

2.0 2.0 0.0 82 KB

A custom builder (and some helper methods) for creating consistent and accessible forms in rails

Home Page: http://rubypond.com

License: MIT License

semantic_form_builder's Introduction

== Semantic Form Builder

Semantic Form Builder is a customer FormBuilder for use in Rails, aiming to
give accessible, consistent, forms with the ultimate of DRY.

No more defining labels, worrying about formatting, etc. Let the default
form_for tag take care of all the hassles for you

For an example of what it looks like check:
http://rubypond.com/articles/2008/07/16/sexy-forms-in-rails/

== Installation

  - script/plugin install git://github.com/rubypond/semantic_form_builder.git
  - rake semantic_form_builder:setup (if the installation script didn't move
  the semantic_form.css into /public/stylesheets/)

1. If you wish to use the builder to replace the default for all forms (which
   is great for consistency) then add the following into an initializer
    ActionView::Base.default_form_builder = SemanticFormBuilder
   Otherwise pass the builder in as the :builder parameter for form_for
2. Be sure to include semantic_forms.css in your layout

== Usage

Continue using form_for and the tag helpers within it as you did before and it
should work fine. There has been a few additional tags added for convenience
sake. They are:

 - submit_and_cancel
 - radio_button_group
 - check_box_group
 
More documentation on their usage to come, in the interim check out or the
http://rubypond.com/articles/2008/07/16/sexy-forms-in-rails/ following
example:

<% form_for @document do |f|
  field_set_tag "Form Details" do %>
    <%= f.date_select :date, :required => true, :help => "date the something happened" %>
    <%= f.text_field :number, :required => true, :help => "the reference number for this thing" %>
    <%= f.select :external_id, [["Choose an option...",""]] + @externals.map{|c| [c.name, c.id]}, :required => true, :label => "options", :help => "select something from the list" %>
    <%= check_box_tag_group "document[other_items][]", @others.map{|u| { :value => u.id, :label => u.description }}, :label => "including these?", :help => "tick the whatever boxes are appropriate for this&nbsp;thing" %>
    <%= f.text_field :name, :help => "what was Willis talkin' about?" %>
    <%= f.check_box :list, :label => "mailing list", :help => "can we send you a bunch of spam?" %>
    <%= f.submit_and_cancel("save", "cancel") %>
<% end %>

semantic_form_builder's People

Contributors

gdagley avatar robdimarco avatar

Stargazers

 avatar  avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.