Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Add some jQuery UI widgets as formtastic input helpers
Branch: master
Pull request Compare This branch is even with elandesign:master.

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
lib
rails
test
.gitignore
MIT-LICENSE
README.textile
Rakefile
formtastic_jquery_ui.gemspec

README.textile

Formtastic jQuery-UI

Adds some jQuery UI widgets as input types for Formtastic

Currently Supports:

  • Autocomplete
  • Calendar

Examples

Autocomplete

The autocomplete module adds jQuery UI’s autocomplete widget to belongs_to, has_many, and has_and_belongs_to_many relationships.

For best results use it with Searchlogic and Will Paginate as shown below

class Product
  belongs_to :brand
  has_and_belongs_to_many :categories
end
class Category
  has_and_belongs_to_many :products
end

The search results should be mapped into value/label pairs for a JSON query

class CategoriesController < ApplicationController
  def index
    @search = Category.search(params[:search])
    @categories = @search.paginate(:page => params[:page])
    respond_to do |format|
      format.html {}
      format.json { @categories.map { |category| {:label => category.title, :value => category.id} }.to_json }
    end
  end
end
class Brand
  has_many :products
end
class BrandsController < ApplicationController
  def index
    @search = Brand.search(params[:search])
    @brands = @search.paginate(:page => params[:page])
    respond_to do |format|
      format.html {}
      format.json { render :json => @brands.map { |brand| {:label => brand.name, :value => brand.id} }.to_json }
    end
  end
end

The input method takes two extra parameters:

  • :url – the URL of the data source (JSON formatted)
  • :param_name – the parameter that will be passed to the URL (as part of the search param)
<% semantic_form_for @product do |f| %>
  <% f.inputs do %>
    <%= f.input :categories, :as => :autocomplete, :url => categories_path(:format => :json), :param_name => 'title_begins_with' %>
    <%= f.input :brand, :as => :autocomplete, :url => brands_path(:format => :json), :param_name => 'name_begins_with' %>
  <% end %>
<% end %>

Datepicker

<% semantic_form_for @todo do |f| %>
  <% f.inputs do %>
    <%= f.input :due_date, :as => :datepicker
  <% end %>
<% end %>

Requirements

This addon requires the following components

  • Formtastic (tested with v1.1.0)
  • jQuery (tested with v1.4.2)
  • jQuery UI� (tested with v1.8.5)
    • 1.7 will not work as it does not include the autocomplete widget
    • Don’t forget to include the necessary CSS and include the images in your project

Copyright © 2010 Paul Smith, released under the MIT license

Something went wrong with that request. Please try again.