首页 \ 问答 \ 帮助渲染来自fields_for的部分内容(Help to render a partial from fields_for)

帮助渲染来自fields_for的部分内容(Help to render a partial from fields_for)

我正在使用nested_attributes并试图通过Ryan Bates关于嵌套模型(#196)的截屏实现添加/删除字段,

这样做,它不会工作,但是当删除“link_to_add_fields”行时,它工作正常。

问题是我不知道我是否正确地完成了所有的关联。

<%= form_for(@item) do |f| %>
<% if @item.errors.any? %>
<div id="error_explanation">
  <h2><%= pluralize(@item.errors.count, "error") %> prohibited this item from being saved:</h2>

  <ul>
  <% @item.errors.full_messages.each do |msg| %>
    <li><%= msg %></li>
  <% end %>
  </ul>
  </div>
  <% end %>

  <div class="field">
    <%= f.label :title %><br />
    <%= f.text_field :title %>
  </div>
  <div class="field">
    <%= f.label :item_type_id %><br />
    <%= f.select :item_type_id, @item_types.collect { |p| [ p.title, p.id ]} %>
    <br />
    <%= f.fields_for :item_parts do |parts_form| %>
      <%= render "item_part_fields", :p => parts_form %>
    <% end %>
  </div>
  <%= link_to_add_fields "Add Part", f, :part %>
  <div class="actions">
    <%= button_for "Save Item", :class => 'positive pill button', :button_type => 'submit' %>
  </div>
<% end %>

其实我的模特是:

“ItemPart”模型:

class ItemPart < ActiveRecord::Base
  belongs_to :item
  belongs_to :part 
end

“物品”型号:

class Item < ActiveRecord::Base
  belongs_to :item_type
  has_many :item_parts
  has_many :parts, :through => :item_parts
  accepts_nested_attributes_for :item_parts, :allow_destroy => true
  after_save :save_id
  validates :title, :presence => true

  def save_id
    item_part_attributes = [ { :item_id => self.id } ]
  end

end

“部分”模型:

class Part < ActiveRecord::Base
  has_one :part_type
  has_many :item_parts
  has_many :items, :through => :item_parts

end

我正在这样做的错误:

undefined method `klass' for nil:NilClass
Extracted source (around line #26):



23:       <%= render "item_part_fields", :p => parts_form %>
24:     <% end %>
25:   </div>
26:   <%= link_to_add_fields "Add Part", f, :item %>
27:   <div class="actions">

应用跟踪

app/helpers/application_helper.rb:44:in `link_to_add_fields'
app/views/items/_form.html.erb:26:in `block in _app_views_items__form_html_erb__1418129287024756954_2169222480__3228169100620818569'
app/views/items/_form.html.erb:1:in `_app_views_items__form_html_erb__1418129287024756954_2169222480__3228169100620818569'
app/views/items/edit.html.erb:3:in `_app_views_items_edit_html_erb___1857878264245794505_2169270380_890290209246324491'

Application_helper.rb

def link_to_add_fields(name, f, association)
  new_object = f.object.class.reflect_on_association(association).klass.new # error line :44
  fields = f.fields_for(association, new_object, :child_index => "new_#{association}") do |builder|
    render(association.to_s.singularize + "_fields", :f => builder)
  end
  link_to_function(name, "add_fields(this, '#{association}', '#{escape_javascript(fields)}')" )
end

I'm using nested_attributes and trying to implement the add/remove fields on-the-fly throu ajax following Ryan Bates screencast about Nested Model (#196)

Doing this, it won't work, but when removing the "link_to_add_fields" line, it works fine.

The problem is that I'm don't know if I doing this all associations right.

<%= form_for(@item) do |f| %>
<% if @item.errors.any? %>
<div id="error_explanation">
  <h2><%= pluralize(@item.errors.count, "error") %> prohibited this item from being saved:</h2>

  <ul>
  <% @item.errors.full_messages.each do |msg| %>
    <li><%= msg %></li>
  <% end %>
  </ul>
  </div>
  <% end %>

  <div class="field">
    <%= f.label :title %><br />
    <%= f.text_field :title %>
  </div>
  <div class="field">
    <%= f.label :item_type_id %><br />
    <%= f.select :item_type_id, @item_types.collect { |p| [ p.title, p.id ]} %>
    <br />
    <%= f.fields_for :item_parts do |parts_form| %>
      <%= render "item_part_fields", :p => parts_form %>
    <% end %>
  </div>
  <%= link_to_add_fields "Add Part", f, :part %>
  <div class="actions">
    <%= button_for "Save Item", :class => 'positive pill button', :button_type => 'submit' %>
  </div>
<% end %>

Actually my models are:

"ItemPart" model:

class ItemPart < ActiveRecord::Base
  belongs_to :item
  belongs_to :part 
end

"Item" model:

class Item < ActiveRecord::Base
  belongs_to :item_type
  has_many :item_parts
  has_many :parts, :through => :item_parts
  accepts_nested_attributes_for :item_parts, :allow_destroy => true
  after_save :save_id
  validates :title, :presence => true

  def save_id
    item_part_attributes = [ { :item_id => self.id } ]
  end

end

"Part" model:

class Part < ActiveRecord::Base
  has_one :part_type
  has_many :item_parts
  has_many :items, :through => :item_parts

end

The error I'm getting doing this way:

undefined method `klass' for nil:NilClass
Extracted source (around line #26):



23:       <%= render "item_part_fields", :p => parts_form %>
24:     <% end %>
25:   </div>
26:   <%= link_to_add_fields "Add Part", f, :item %>
27:   <div class="actions">

Application trace

app/helpers/application_helper.rb:44:in `link_to_add_fields'
app/views/items/_form.html.erb:26:in `block in _app_views_items__form_html_erb__1418129287024756954_2169222480__3228169100620818569'
app/views/items/_form.html.erb:1:in `_app_views_items__form_html_erb__1418129287024756954_2169222480__3228169100620818569'
app/views/items/edit.html.erb:3:in `_app_views_items_edit_html_erb___1857878264245794505_2169270380_890290209246324491'

Application_helper.rb

def link_to_add_fields(name, f, association)
  new_object = f.object.class.reflect_on_association(association).klass.new # error line :44
  fields = f.fields_for(association, new_object, :child_index => "new_#{association}") do |builder|
    render(association.to_s.singularize + "_fields", :f => builder)
  end
  link_to_function(name, "add_fields(this, '#{association}', '#{escape_javascript(fields)}')" )
end

原文:https://stackoverflow.com/questions/6939634
更新时间:2024-04-24 21:04

最满意答案

我想你需要一个不同的背景颜色,这就是为什么border-radius: 25px 0 0 25px; 不适合你。 一种解决方案是选择背景并更改其渐变。 我已使用http://www.cssmatic.com/gradient-generator生成颜色渐变。

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
  border: 0;
  
  color: #ffffff;
  border-radius: 25px;
  text-align: center;
  
}
.ui-datepicker td {
    border: 0;
    padding: 0px;
}

//Create the gradient for the td here-- only for the selected date
//At the end date, reverse the gradient and it will look almost like the picture you shared. 
 .ui-datepicker-today {
 background: rgba(105,84,68,1);
background: -moz-linear-gradient(left, rgba(105,84,68,1) 47%, rgba(173,217,120,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(47%, rgba(105,84,68,1)), color-stop(100%, rgba(173,217,120,1)));
background: -webkit-linear-gradient(left, rgba(105,84,68,1) 47%, rgba(173,217,120,1) 100%);
background: -o-linear-gradient(left, rgba(105,84,68,1) 47%, rgba(173,217,120,1) 100%);
background: -ms-linear-gradient(left, rgba(105,84,68,1) 47%, rgba(173,217,120,1) 100%);
background: linear-gradient(to right, rgba(105,84,68,1) 47%, rgba(173,217,120,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#695444', endColorstr='#add978', GradientType=1 );
 }


Finally done this only with css, see FIDDLE here One need to play a bit with position and after.

$("#datepicker").datepicker();
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
  border: 0;
  border-radius: 25px;
  text-align: center;
}
td {
  position: relative;
  z-index: 1111;
}
a.ui-state-default.ui-state-highlight:after {
  content: "";
  background: green;
  height: 23px;
  width: 25px;
  position: absolute;
  z-index: -1;
  right: 0;
  top: 1px;
}
<!DOCTYPE html>
<html>

<head>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>

<body>

  <div class="demo">

    <p>Date:
      <input id="datepicker" type="text">
    </p>

  </div>
  <!-- End demo -->

  <div style="display: none;" class="demo-description">
    <p>The datepicker is tied to a standard form input field. Focus on the input (click, or use the tab key) to open an interactive calendar in a small overlay. Choose a date, click elsewhere on the page (blur the input), or hit the Esc key to close. If
      a date is chosen, feedback is shown as the input's value.</p>
  </div>
  <!-- End demo-description -->
</body>

</html>

相关问答

更多

相关文章

更多

最新问答

更多
  • CSS修复容器和溢出元素(CSS Fix container and overflow elements)
  • SQL多个连接在与where子句相同的表上(SQL Multiple Joins on same table with where clause)
  • nginx 80端口反向代理多个域名,怎样隐藏端口的
  • xcode提醒样式,swift 3(xcode alert style, swift 3)
  • 在Chrome控制台中调试JavaScript(debugging javascript in Chrome console)
  • Javascript - 试图围绕自定义事件(Javascript - Trying to wrap my head around custom events)
  • 边栏链接不可点击(Sidebar links aren't clickable)
  • 使用recpatcha gem时如何显示其他表单错误?(How do I display other form errors when using the recpatcha gem?)
  • boost.python避免两次注册内部类,但仍然在python中公开(boost.python Avoid registering inner class twice but still expose in python)
  • Android 现在软件很少吗?以后会多起来吗
  • 如何在ActiveAdmin 0.5.0中为资源全局指定预先加载?(How to specify eager loading globally for a resource in ActiveAdmin 0.5.0?)
  • matlab代码为黄金比例持续分数(matlab code for golden ratio continued fraction)
  • Android浏览器触摸事件位置(Android browser touch event location)
  • 将cURL输出分配给Bash中的变量(Assign output to variable in Bash)
  • 我如何在MVC视图上没有时间获取当前日期(how i can get current date without time on MVC view)
  • sql连接函数(sql join of function)
  • 为什么在Xamarin Media插件中使用ImageSource.FromStream而不是FromFile?(Why use ImageSource.FromStream instead of FromFile in Xamarin Media plugin?)
  • 这段代码是否真的可以防止SQL注入?(Will this code actually work against SQL-injection? [duplicate])
  • 信阳方远计算机学校大专证被国家认可么
  • React / Rails AJAX POST请求返回404(React/Rails AJAX POST request returns 404)
  • Android与php服务器交互(Android interact with php server)
  • 自动刷新QTableWidget可能吗?(Refresh QTableWidget automatically possible?)
  • JVM / Compiler优化对象的未使用属性(optimization of unused properties of object by JVM / Compiler)
  • 插入表格时,乌克兰字符会更改为问号(Ukrainian character change to question mark when insert to table)
  • 在头文件中包含异常类(Including an exception class in a header file)
  • 完成c#中的执行后关闭sqlcmd(Close sqlcmd after finishing executing in c#)
  • 使用软导航栏正确检测屏幕尺寸(Detecting screensize correctly with soft navigation bar)
  • Typescript:从输入更新值(Typescript : update value from input)
  • 如何在执行某些行后仅在断点处停止?(How to only stop at a breakpoint after some line was executed?)
  • 以未定义的元素在JSON中循环(loop in JSON with undefined elements)