Ruby on Rails:令牌字段 - railscast

时间:2012-10-04 14:31:59

标签: ruby-on-rails controller

我正在尝试让令牌字段在我的应用上运行。

我完全关注了这段视频:http://railscasts.com/episodes/258-token-fields

项目模型

class Project < ActiveRecord::Base
  attr_accessible  :edited_first_name, :edited_last_name, :first_name, :last_name, :business_div, :client, :customer_benifits, :edited_date, :end_date, :entry_date,  :financials, :industry, :keywords, :lessons_learned, :project_name, :project_owner, :role, :start_date, :status, :summary, :tech , :technols, :technol_tokens


has_many :projecttechnols
has_many :technols, :through => :projecttechnols

attr_reader :technol_tokens

  def technol_tokens=(ids)
    self.technol_ids = ids.split(",")
  end


accepts_nested_attributes_for(:technols)

technols controller:

def index
    @technols = Technol.where("tech like ?", "%#{params[:q]}%")

    respond_to do |format|
      format.html # index.html.erb
    format.json { render :json => @technols.map(&:attributes) }
    end
  end

布局/ application.html.erb

<!DOCTYPE html>
<html>
<head>

<div id="user_nav">
  <% if user_signed_in? %>
    Hi <%= current_user.firstname %>, Signed in as  <%= current_user.email %>.  Not you?

<%= link_to "Sign out", destroy_user_session_path, :method => :delete %>
  <% else %>
    <%= link_to "Sign up", new_user_registration_path %> or
    <%= link_to "Sign in", new_user_session_path %>
  <% end %>
</div>
<% if current_user.try(:admin?) %>
 <div class="admin_button">
<%= button_to "ADMIN", users_path, :class => "button", :method => "get" %>

</div>




<% end %>
  <title>ExceptionApp</title>



<!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js" type="text/javascript"></script>
  <![endif]-->
  <%= stylesheet_link_tag    "application", "token-input-facebook" %>
  <%= csrf_meta_tags %>
<link href="application.css" rel="stylesheet" />



<meta name="viewport" content="width=device-width; initial-scale=1.0">


<link rel="SHORTCUT ICON"
       href="/assets/minilogo.png">



<%= link_to(image_tag("/assets/logo.png"), projects_path, :class => "logow") %>

</head>
<body>

<%= yield %>


<style>
.debug {


position:absolute; right:0px; bottom:0px;

}
</style>
<div class ="debug">
<%= debug(params) %>
<div>


<%= content_tag(:div, flash[:error], :id => "flash_error") if flash[:error] %>
<%= content_tag(:div, flash[:alert], :id => "flash_alert") if flash[:alert] %>
<!-- Javascripts
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <%= javascript_include_tag :defaults, "application", "jquery.tokeninput" %>

  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>


</body>
</html>

项目/ new.html.erb

<%= stylesheet_link_tag "new" %>


<h1>Create New Project</h1>

<%= stylesheet_link_tag "form" %>


<%= form_for(@project) do |f| %>



<p>
    <%= f.label :technol_tokens, "technol" %><br />
    <%= f.text_field :technol_tokens, "data-pre" => @project.technols.map(&:attributes).to_json %>
  </p>



</BODY>
</HTML>


<div class="create_button">
<div class="actions">
    <%= f.submit "Save New Project", :class => "button",  :confirm => "Are you sure you want to save the new project?" %>
  </div>
</div>




</div> <%#= small div %>





<% end %>



<div class="back_button2">
<%= button_to "Back", projects_path , :class => "button", :method => "get" %>
</div>

application.js 编辑:

$(function() {
  $("#project_technol_tokens").tokenInput("/technols.json", {
    crossDomain: false,
    prePopulate: $("#project_technol_tokens").data("pre"),
    theme: "facebook"
  });
});



$(function() {
  $("#project_start_date").datepicker({dateFormat: 'dd-mm-yy'});
});

$(function() {
  $("#project_end_date").datepicker({dateFormat: 'dd-mm-yy'});
});



jQuery(function(){

jQuery('#start_date_A').datepicker({dateFormat: "dd-mm-yy"});
});

jQuery(function(){

jQuery('#start_date_B').datepicker({dateFormat: "dd-mm-yy"});
});

在我的新页面上,我有一个可用的jquery datepicker文本框。我不明白为什么同一页面上的令牌字段不起作用。

我已经完全按照视频大约3次来确定,但它仍然无法正常工作。唯一的区别是我把我的javascripts和样式表放在assets文件夹中,在视频中它放在公共文件夹中。有人可以帮忙吗?感谢。

1 个答案:

答案 0 :(得分:0)

不是可能的错误。请尝试以下方法:

  1. 检查您的application.js文件。你是否包含了jquery.tokeninput.js文件?
  2. 确保在application.js
  3. 中的jquery之后需要令牌输入js文件
  4. 检查以确保包含CSS文件
  5. 在浏览器中,您是否在控制台中收到任何js错误?如果是,请提出问题。
  6. 修改

    另外,我刚刚注意到,在你的new.html.erb中,你在html结束标记后面有一个div!

    </BODY>
    </HTML>
    

    请将它们取出/放在适当的位置。