formtastic_jquery_ui 0.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/MIT-LICENSE +20 -0
- data/README.textile +99 -0
- data/Rakefile +23 -0
- data/lib/formtastic_jquery_ui/autocomplete.rb +84 -0
- data/lib/formtastic_jquery_ui/datepicker.rb +19 -0
- data/lib/formtastic_jquery_ui.rb +9 -0
- data/lib/tasks/formtastic_jquery_ui.rake +4 -0
- data/rails/init.rb +2 -0
- data/test/formtastic_jquery_ui_test.rb +8 -0
- data/test/test_helper.rb +4 -0
- metadata +78 -0
data/MIT-LICENSE
ADDED
@@ -0,0 +1,20 @@
|
|
1
|
+
Copyright (c) 2010 Paul Smith
|
2
|
+
|
3
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
4
|
+
a copy of this software and associated documentation files (the
|
5
|
+
"Software"), to deal in the Software without restriction, including
|
6
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
7
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
8
|
+
permit persons to whom the Software is furnished to do so, subject to
|
9
|
+
the following conditions:
|
10
|
+
|
11
|
+
The above copyright notice and this permission notice shall be
|
12
|
+
included in all copies or substantial portions of the Software.
|
13
|
+
|
14
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
15
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
16
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
17
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
18
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
19
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
20
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
data/README.textile
ADDED
@@ -0,0 +1,99 @@
|
|
1
|
+
h1. Formtastic jQuery-UI
|
2
|
+
|
3
|
+
Adds some "jQuery UI":http://jqueryui.com widgets as input types for "Formtastic":http://github.com/justinfrench/formtastic
|
4
|
+
|
5
|
+
Currently Supports:
|
6
|
+
|
7
|
+
* Autocomplete
|
8
|
+
* Calendar
|
9
|
+
|
10
|
+
h2. Examples
|
11
|
+
|
12
|
+
h3. Autocomplete
|
13
|
+
|
14
|
+
The autocomplete module adds jQuery UI's autocomplete widget to <code>belongs_to</code>, <code>has_many</code>, and <code>has_and_belongs_to_many</code> relationships.
|
15
|
+
|
16
|
+
For best results use it with "Searchlogic":http://github.com/binarylogic/searchlogic and "Will Paginate":http://github.com/mislav/will_paginate as shown below
|
17
|
+
|
18
|
+
<pre><code>
|
19
|
+
class Product
|
20
|
+
belongs_to :brand
|
21
|
+
has_and_belongs_to_many :categories
|
22
|
+
end
|
23
|
+
</code></pre>
|
24
|
+
|
25
|
+
<pre><code>
|
26
|
+
class Category
|
27
|
+
has_and_belongs_to_many :products
|
28
|
+
end
|
29
|
+
</code></pre>
|
30
|
+
|
31
|
+
The search results should be mapped into value/label pairs for a JSON query
|
32
|
+
|
33
|
+
<pre><code>
|
34
|
+
class CategoriesController < ApplicationController
|
35
|
+
def index
|
36
|
+
@search = Category.search(params[:search])
|
37
|
+
@categories = @search.paginate(:page => params[:page])
|
38
|
+
respond_to do |format|
|
39
|
+
format.html {}
|
40
|
+
format.json { @categories.map { |category| {:label => category.title, :value => category.id} }.to_json }
|
41
|
+
end
|
42
|
+
end
|
43
|
+
end
|
44
|
+
</pre></code>
|
45
|
+
|
46
|
+
<pre><code>
|
47
|
+
class Brand
|
48
|
+
has_many :products
|
49
|
+
end
|
50
|
+
</code></pre>
|
51
|
+
|
52
|
+
<pre><code>
|
53
|
+
class BrandsController < ApplicationController
|
54
|
+
def index
|
55
|
+
@search = Brand.search(params[:search])
|
56
|
+
@brands = @search.paginate(:page => params[:page])
|
57
|
+
respond_to do |format|
|
58
|
+
format.html {}
|
59
|
+
format.json { @brands.map { |brand| {:label => brand.name, :value => brand.id} }.to_json }
|
60
|
+
end
|
61
|
+
end
|
62
|
+
end
|
63
|
+
</pre></code>
|
64
|
+
|
65
|
+
The input method takes two extra parameters:
|
66
|
+
|
67
|
+
* <code>:url</code> - the URL of the data source (JSON formatted)
|
68
|
+
* <code>:param_name</code> - the parameter that will be passed to the URL (as part of the search param)
|
69
|
+
|
70
|
+
<pre><code>
|
71
|
+
<% semantic_form_for @product do |f| %>
|
72
|
+
<% f.inputs do %>
|
73
|
+
<%= f.input :categories, :as => :autocomplete, :url => categories_path(:format => :json), :param_name => 'title_begins_with' %>
|
74
|
+
<%= f.input :brand, :as => :autocomplete, :url => brands_path(:format => :json), :param_name => 'name_begins_with' %>
|
75
|
+
<% end %>
|
76
|
+
<% end %>
|
77
|
+
</code></pre>
|
78
|
+
|
79
|
+
h2. Datepicker
|
80
|
+
|
81
|
+
<pre><code>
|
82
|
+
<% semantic_form_for @todo do |f| %>
|
83
|
+
<% f.inputs do %>
|
84
|
+
<%= f.input :due_date, :as => :datepicker
|
85
|
+
<% end %>
|
86
|
+
<% end %>
|
87
|
+
</code></pre>
|
88
|
+
|
89
|
+
h2. Requirements
|
90
|
+
|
91
|
+
This addon requires the following components
|
92
|
+
|
93
|
+
* "Formtastic":http://github.com/justinfrench/formtastic (tested with v1.1.0)
|
94
|
+
* "jQuery":http://jquery.com (tested with v1.4.2)
|
95
|
+
* "jQuery UI":http://jqueryui.com (tested with v1.8.5)
|
96
|
+
** *1.7 will not work as it does not include the autocomplete widget*
|
97
|
+
** Don't forget to include the necessary CSS and include the images in your project
|
98
|
+
|
99
|
+
Copyright (c) 2010 Paul Smith, released under the MIT license
|
data/Rakefile
ADDED
@@ -0,0 +1,23 @@
|
|
1
|
+
require 'rake'
|
2
|
+
require 'rake/testtask'
|
3
|
+
require 'rake/rdoctask'
|
4
|
+
|
5
|
+
desc 'Default: run unit tests.'
|
6
|
+
task :default => :test
|
7
|
+
|
8
|
+
desc 'Test the formtastic_jquery_ui plugin.'
|
9
|
+
Rake::TestTask.new(:test) do |t|
|
10
|
+
t.libs << 'lib'
|
11
|
+
t.libs << 'test'
|
12
|
+
t.pattern = 'test/**/*_test.rb'
|
13
|
+
t.verbose = true
|
14
|
+
end
|
15
|
+
|
16
|
+
desc 'Generate documentation for the formtastic_jquery_ui plugin.'
|
17
|
+
Rake::RDocTask.new(:rdoc) do |rdoc|
|
18
|
+
rdoc.rdoc_dir = 'rdoc'
|
19
|
+
rdoc.title = 'Formtastic-jquery-ui'
|
20
|
+
rdoc.options << '--line-numbers' << '--inline-source'
|
21
|
+
rdoc.rdoc_files.include('README')
|
22
|
+
rdoc.rdoc_files.include('lib/**/*.rb')
|
23
|
+
end
|
@@ -0,0 +1,84 @@
|
|
1
|
+
module FormtasticJQueryUI
|
2
|
+
module Autocomplete
|
3
|
+
|
4
|
+
def autocomplete_input(method, options)
|
5
|
+
html_options = options.delete(:input_html) || {}
|
6
|
+
options = set_include_blank(options)
|
7
|
+
html_options[:multiple] = html_options[:multiple] || options.delete(:multiple)
|
8
|
+
html_options.delete(:multiple) if html_options[:multiple].nil?
|
9
|
+
|
10
|
+
html = ""
|
11
|
+
reflection = self.reflection_for(method)
|
12
|
+
input_name = "autocomplete_for_#{sanitized_object_name}_#{method}"
|
13
|
+
param_name = options[:param_name] || 'term'
|
14
|
+
url = options[:url] || ''
|
15
|
+
|
16
|
+
if reflection && [:has_many, :has_and_belongs_to_many].include?(reflection.macro)
|
17
|
+
selections_name = generate_html_id(method, 'selections')
|
18
|
+
selection_name = "#{sanitized_object_name}[#{method.to_s.singularize}_ids][]"
|
19
|
+
html << template.content_tag(:ul, object.send(method).map { |i| template.content_tag(:li, "<input type=\"hidden\" name=\"#{selection_name}\" value=\"#{i.id}\" />#{i.to_label} <a href=\"#\" onclick=\"$(this).closest('li').remove();\">Remove</a>") }.join(''), :id => selections_name)
|
20
|
+
html << template.tag(:input, :type => 'hidden', :name => selection_name, :value => '')
|
21
|
+
html << template.text_field_tag(input_name)
|
22
|
+
html << template.content_tag(:script, :type => 'text/javascript') do
|
23
|
+
<<-EOT
|
24
|
+
$('##{input_name}').autocomplete({
|
25
|
+
source: function(request, response) {
|
26
|
+
$.ajax({
|
27
|
+
url: '#{url}',
|
28
|
+
dataType: 'json',
|
29
|
+
data: {
|
30
|
+
search: { #{param_name}: request.term }
|
31
|
+
},
|
32
|
+
success: function(data) {
|
33
|
+
response(data);
|
34
|
+
}
|
35
|
+
});
|
36
|
+
},
|
37
|
+
select: function(event, selection) {
|
38
|
+
if($('##{selections_name} input[value=' + selection.item.value + ']').length == 0)
|
39
|
+
$('##{selections_name}').append('<li><input type="hidden" name="#{selection_name}" value="' + selection.item.value + '" />' + selection.item.label + ' <a href="#" onclick="$(this).closest(\\'li\\').remove();">Remove</a></li>');
|
40
|
+
$('##{input_name}').val('');
|
41
|
+
return false;
|
42
|
+
},
|
43
|
+
focus: function(event, ui) { return false; }
|
44
|
+
});
|
45
|
+
EOT
|
46
|
+
end
|
47
|
+
elsif reflection && [:belongs_to].include?(reflection.macro)
|
48
|
+
html << self.hidden_field(reflection.primary_key_name)
|
49
|
+
html << template.text_field_tag(input_name, object.send(method).try(detect_label_method([object.send(method)])))
|
50
|
+
html << template.content_tag(:script, :type => 'text/javascript') do
|
51
|
+
<<-EOT
|
52
|
+
$('##{input_name}').autocomplete({
|
53
|
+
source: function(request, response) {
|
54
|
+
$.ajax({
|
55
|
+
url: '#{url}',
|
56
|
+
dataType: 'json',
|
57
|
+
data: {
|
58
|
+
search: { #{param_name}: request.term }
|
59
|
+
},
|
60
|
+
success: function(data) {
|
61
|
+
response(data);
|
62
|
+
}
|
63
|
+
});
|
64
|
+
},
|
65
|
+
select: function(event, selection) {
|
66
|
+
$('##{sanitized_object_name}_#{reflection.primary_key_name}').val(selection.item.value);
|
67
|
+
$('##{input_name}').val(selection.item.label);
|
68
|
+
return false;
|
69
|
+
},
|
70
|
+
focus: function(event, ui) { return false; }
|
71
|
+
});
|
72
|
+
$('##{input_name}').blur(function(event){
|
73
|
+
if($(this).val() == '')
|
74
|
+
$('##{sanitized_object_name}_#{reflection.primary_key_name}').val('');
|
75
|
+
})
|
76
|
+
EOT
|
77
|
+
end
|
78
|
+
end
|
79
|
+
|
80
|
+
template.content_tag(:label, method.to_s.humanize, :for => input_name) << html
|
81
|
+
end
|
82
|
+
|
83
|
+
end
|
84
|
+
end
|
@@ -0,0 +1,19 @@
|
|
1
|
+
module FormtasticJQueryUI
|
2
|
+
module Datepicker
|
3
|
+
|
4
|
+
def datepicker_input(method, options)
|
5
|
+
html_options = options.delete(:input_html) || {}
|
6
|
+
html_options = default_string_options(method, type).merge(html_options) if [:numeric, :string, :password, :text].include?(type)
|
7
|
+
|
8
|
+
self.label(method, options_for_label(options)) <<
|
9
|
+
self.send(:text_field, method, html_options) <<
|
10
|
+
template.content_tag(:script, :type => 'text/javascript') do
|
11
|
+
<<-EOT
|
12
|
+
$('##{sanitized_object_name}_#{method}').datepicker({dateFormat: 'yy-mm-dd'});
|
13
|
+
EOT
|
14
|
+
end
|
15
|
+
end
|
16
|
+
|
17
|
+
end
|
18
|
+
end
|
19
|
+
|
@@ -0,0 +1,9 @@
|
|
1
|
+
if Object.const_defined?("Formtastic")
|
2
|
+
|
3
|
+
require 'formtastic_jquery_ui/datepicker.rb'
|
4
|
+
Formtastic::SemanticFormBuilder.send(:include, FormtasticJQueryUI::Datepicker)
|
5
|
+
|
6
|
+
require 'formtastic_jquery_ui/autocomplete.rb'
|
7
|
+
Formtastic::SemanticFormBuilder.send(:include, FormtasticJQueryUI::Autocomplete)
|
8
|
+
|
9
|
+
end
|
data/rails/init.rb
ADDED
data/test/test_helper.rb
ADDED
metadata
ADDED
@@ -0,0 +1,78 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: formtastic_jquery_ui
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
hash: 29
|
5
|
+
prerelease: false
|
6
|
+
segments:
|
7
|
+
- 0
|
8
|
+
- 0
|
9
|
+
- 1
|
10
|
+
version: 0.0.1
|
11
|
+
platform: ruby
|
12
|
+
authors:
|
13
|
+
- Paul Smith
|
14
|
+
autorequire:
|
15
|
+
bindir: bin
|
16
|
+
cert_chain: []
|
17
|
+
|
18
|
+
date: 2010-09-23 00:00:00 +01:00
|
19
|
+
default_executable:
|
20
|
+
dependencies: []
|
21
|
+
|
22
|
+
description: Currently provides autocomplete and datepicker widgets
|
23
|
+
email: paul@elandesign.co.uk
|
24
|
+
executables: []
|
25
|
+
|
26
|
+
extensions: []
|
27
|
+
|
28
|
+
extra_rdoc_files: []
|
29
|
+
|
30
|
+
files:
|
31
|
+
- lib/formtastic_jquery_ui/autocomplete.rb
|
32
|
+
- lib/formtastic_jquery_ui/datepicker.rb
|
33
|
+
- lib/formtastic_jquery_ui.rb
|
34
|
+
- lib/tasks/formtastic_jquery_ui.rake
|
35
|
+
- test/formtastic_jquery_ui_test.rb
|
36
|
+
- test/test_helper.rb
|
37
|
+
- rails/init.rb
|
38
|
+
- MIT-LICENSE
|
39
|
+
- Rakefile
|
40
|
+
- README.textile
|
41
|
+
has_rdoc: true
|
42
|
+
homepage: http://github.com/elandesign/formtastic_jquery_ui
|
43
|
+
licenses: []
|
44
|
+
|
45
|
+
post_install_message:
|
46
|
+
rdoc_options: []
|
47
|
+
|
48
|
+
require_paths:
|
49
|
+
- lib
|
50
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
51
|
+
none: false
|
52
|
+
requirements:
|
53
|
+
- - ">="
|
54
|
+
- !ruby/object:Gem::Version
|
55
|
+
hash: 3
|
56
|
+
segments:
|
57
|
+
- 0
|
58
|
+
version: "0"
|
59
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
60
|
+
none: false
|
61
|
+
requirements:
|
62
|
+
- - ">="
|
63
|
+
- !ruby/object:Gem::Version
|
64
|
+
hash: 19
|
65
|
+
segments:
|
66
|
+
- 1
|
67
|
+
- 3
|
68
|
+
- 4
|
69
|
+
version: 1.3.4
|
70
|
+
requirements: []
|
71
|
+
|
72
|
+
rubyforge_project: formtastic_jquery_ui
|
73
|
+
rubygems_version: 1.3.7
|
74
|
+
signing_key:
|
75
|
+
specification_version: 3
|
76
|
+
summary: Provides Formtastic input helpers for some jQuery UI widgets
|
77
|
+
test_files: []
|
78
|
+
|