Screencast: jQuery Tokeninput

Autokompletierung ist eine hilfreiche Funktion für viele Anwender. Mit jQuery Tokeninput ist die relativ einfach umzusetzen. Ryan zeigt zudem noch wie es im Zusammenhang mit Rails eingesetzt werden kann.

 

Download:

Download(21.7 MB, 11:09)
Alternativer Download für iPod & Apple TV(20.4 MB, 11:09)

 

Resourcen:

 

Quellcode:

[bash]
bundle
rails g jquery:install
[/bash]

[ruby]
# Gemfile
gem "jquery-rails"

# models/book.rb
class Book < ActiveRecord::Base
attr_accessible :name, :author_tokens
has_many :authorships
has_many :authors, :through => :authorships
attr_reader :author_tokens

def author_tokens=(ids)
self.author_ids = ids.split(",")
end
end

# authors_controller.rb
def index
@authors = Author.where("name like ?", "%#{params[:q]}%")
respond_to do |format|
format.html
format.json { render :json => @authors.map(&:attributes) }
end
end
[/ruby]

[html]
<!– layouts/application.html.erb –>
<%= stylesheet_link_tag "application", "token-input-facebook" %>
<%= javascript_include_tag :defaults, "jquery.tokeninput" %>

<!– books/_form.html.erb –>
<p>
<%= f.label :author_tokens, "Authors" %><br />
<%= f.text_field :author_tokens, "data-pre" => @book.authors.map(&:attributes).to_json %>
</p>
[/html]

[javascript]
// application.js
$(function() {
$("#book_author_tokens").tokenInput("/authors.json", {
crossDomain: false,
prePopulate: $("#book_author_tokens").data("pre"),
theme: "facebook"
});
});
[/javascript]

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Diese Website verwendet Akismet, um Spam zu reduzieren. Erfahre mehr darüber, wie deine Kommentardaten verarbeitet werden.