统计has_many结果.
当用户编辑统计数据时,即使该类别是月平均值,结果的日期格式也会切换到[Month] [Day] [Year],这意味着日期格式应该保留[Month] [Year].
stat.js
$(document).ready(function()
{
$('.date-format-switcher').click(function(event){
event;
if ($(this).attr('id') == 'stat_categories_instance') {
$('.day').show();
} else if ($(this).attr('id') == 'stat_categories_averaged') {
$('.day').hide();
}
})
$('.add-form-padding').on('cocoon:after-insert',function(e,insertedItem) {
if($('#stat_categories_instance').is(':checked')) {
$('.day').show();
} else {
$('.day').hide();
}
})
});
<% Stat::CATEGORIES.each do |c| %> <span class="label label-primary"> <%= label(c,c) %>:</span> <%= f.radio_button(:categories,c,:class => "date-format-switcher") %> <% end %> <%= f.fields_for :results do |result| %> <%= render 'result_fields',:f => result %> <% end %> <%= link_to_add_association f,:results do %> <span class="glyphicon glyphicon-plus"></span> Result <% end %>
为了进一步澄清问题,用户去编辑_form时,即使将其作为平均类别([Month] [Year]]将_result_fields date_select重置为实例类别([Month] [Day] [Year]) ).
<%= f.text_field :result_value,class: 'form-control',placeholder: 'Enter Result' %> <%= f.date_select :date_value,:order => [:month,:day,:year],:with_css_classes => true,:class => "date-select" %>
我认为问题是与JavaScript,但如果您需要进一步的代码或澄清,请让我知道：]
stat.rb
class Stat < ActiveRecord::Base
belongs_to :user
has_many :results
accepts_nested_attributes_for :results,:reject_if => :all_blank,:allow_destroy => true #correct
scope :averaged,-> { where(categories: 'Averaged') }
scope :instance,-> { where(categories: 'Instance') }
validates :categories,:metric,:results,presence: true
CATEGORIES = ['Averaged','Instance']
end
按要求
<!DOCTYPE html> <html> <head> <title>Personal Control Center</title> <link rel="stylesheet" media="all" href="/assets/application-160f5c0baab5966f165d1ceda4baf96f.css" /> <script src="/assets/application-3553266740dedab0ebae9bc455264add.js"></script> <Meta name="csrf-param" content="authenticity_token" /> <Meta name="csrf-token" content="0L0etiyhQeSadH9jJycPZun8eOh0WzPg2iy1djmdQOUJzyEwX+tVBKktlu5AhHd0Zyw6vlZUMzOosRcYAbvFbA==" /> <Meta name="description" content="Habits | Goals | Values | Stats" /> <Meta name="viewport" content="width=device-width,initial-scale=1.0"> <!-- Tells app to be mobile responsive --> <Meta name="google-site-verification" content="Cd6S_eRTPmKoMPGhVcYjfFTeYsptlUiSQvdDajy1vmI" /> </head> <body> <nav class="navbar navbar-default navbar-fixed-top" role="navigation"> <div class="container"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="/">Personal Control Center</a> <!-- Collect the nav links,forms,and other content for toggling --> <div class="collapse navbar-collapse navbar-ex1-collapse"> <ul class="nav navbar-nav navbar-right"> <li> <a href="/habits/new"> <span class="glyphicon glyphicon-plus"></span> <b>Habit</b> </a></li> <li> <a href="/valuations/new"> <span class="glyphicon glyphicon-plus"></span> <b>Value</b> </a></li> <li> <a href="/goals/new"> <span class="glyphicon glyphicon-plus"></span> <b>Goal</b> </a> </li> <li> <a href="/stats/new"> <span class="glyphicon glyphicon-plus"></span> <b>Stat</b> </a> </li> <li><a href="/activities">Feed</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> Account <b class="caret"></b> </a> <ul class="dropdown-menu"> <li><a href="/users">Users</a></li> <li><a href="/users/1/edit">Settings</a></li> <li><a href="/about">About</a></li> <li><a rel="nofollow" data-method="delete" href="/logout">Log out</a></li> </li> </ul> </ul> </div> </div> </nav> <div class="jumbotron"> <p class="text-center"> <div class="jumbtron"> <div class="container"> <h1><b>Edit Stat</b></h1> <p>If there is no struggle,<br> there is no progress. Positive anything <br> is better than negative nothing. </p> </div> </div> <!-- this variable should be assigned in your controller action--> </p> </div> <div class="container-fluid"> <div class="container"> <div class="col-md-9"> <script src="/assets/stat-7dc4e947c11e58375e6b13b6d489f73b.js"></script> <form novalidate="novalidate" class="simple_form edit_stat" id="edit_stat_1" action="/stats/1" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="✓" /><input type="hidden" name="_method" value="patch" /><input type="hidden" name="authenticity_token" value="pu54sleLSOjc4xlsXm1d8jdOATUAxkYTLA+f4AIp6iR/nEc0JMFcCO+68OE5ziXguZ5DYyLJRsBekj2OOg9vrQ==" /> <div class="add-form-padding"> <form> <div class="form-group"> <span class="label label-primary"> <label for="Averaged_Averaged">Averaged</label>:</span> <input class="date-format-switcher" type="radio" value="Averaged" checked="checked" name="stat[categories]" id="stat_categories_averaged" /> <span class="label label-primary"> <label for="Instance_Instance">Instance</label>:</span> <input class="date-format-switcher" type="radio" value="Instance" name="stat[categories]" id="stat_categories_instance" /> </div> <div class="form-group"> <input class="form-control" id="five" placeholder="Enter Action" type="text" value="Ran" name="stat[action]" /> <input class="form-control" id="five" placeholder="Enter Metric" type="text" value="miles" name="stat[metric]" /> </div> <div class="form-group"> <input class="form-control" id="tags" placeholder="Enter Tag(s)" value="run" type="text" name="stat[tag_list]" /> </div> <div id="results"> <div class="nested-fields"> <div class="nested"> <div class="form-group"> <input class="form-control" placeholder="Enter Result" type="text" value="45" name="stat[results_attributes][0][result_value]" id="stat_results_attributes_0_result_value" /> <div class="center"> <select id="stat_results_attributes_0_date_value_2i" name="stat[results_attributes][0][date_value(2i)]" class="month"> <option value="1">January</option> <option value="2">February</option> <option value="3">March</option> <option value="4">April</option> <option value="5">May</option> <option value="6" selected="selected">June</option> <option value="7">July</option> <option value="8">August</option> <option value="9">September</option> <option value="10">October</option> <option value="11">November</option> <option value="12">December</option> </select> <select id="stat_results_attributes_0_date_value_3i" name="stat[results_attributes][0][date_value(3i)]" class="day"> <option value="1" selected="selected">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> <option value="16">16</option> <option value="17">17</option> <option value="18">18</option> <option value="19">19</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> <option value="26">26</option> <option value="27">27</option> <option value="28">28</option> <option value="29">29</option> <option value="30">30</option> <option value="31">31</option> </select> <select id="stat_results_attributes_0_date_value_1i" name="stat[results_attributes][0][date_value(1i)]" class="year"> <option value="2010">2010</option> <option value="2011">2011</option> <option value="2012">2012</option> <option value="2013">2013</option> <option value="2014">2014</option> <option value="2015" selected="selected">2015</option> <option value="2016">2016</option> <option value="2017">2017</option> <option value="2018">2018</option> <option value="2019">2019</option> <option value="2020">2020</option> </select> <div class="bad-pad"> <span class="label label-danger">Bad:</span> <input name="stat[results_attributes][0][bad]" type="hidden" value="0" /><input type="checkBox" value="1" name="stat[results_attributes][0][bad]" id="stat_results_attributes_0_bad" /> </div> <div class="bad-pad"> <span class="label label-danger"> <input type="hidden" name="stat[results_attributes][0][_destroy]" id="stat_results_attributes_0__destroy" value="false" /><a class="remove_fields existing" href="#"> <span class="glyphicon glyphicon-trash"></span> Delete </a> </span> </div> </div> </div> </div> </div> <input type="hidden" value="1" name="stat[results_attributes][0][id]" id="stat_results_attributes_0_id" /> <div class="nested-fields"> <div class="nested"> <div class="form-group"> <input class="form-control" placeholder="Enter Result" type="text" value="27" name="stat[results_attributes][1][result_value]" id="stat_results_attributes_1_result_value" /> <div class="center"> <select id="stat_results_attributes_1_date_value_2i" name="stat[results_attributes][1][date_value(2i)]" class="month"> <option value="1">January</option> <option value="2">February</option> <option value="3">March</option> <option value="4">April</option> <option value="5" selected="selected">May</option> <option value="6">June</option> <option value="7">July</option> <option value="8">August</option> <option value="9">September</option> <option value="10">October</option> <option value="11">November</option> <option value="12">December</option> </select> <select id="stat_results_attributes_1_date_value_3i" name="stat[results_attributes][1][date_value(3i)]" class="day"> <option value="1" selected="selected">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> <option value="16">16</option> <option value="17">17</option> <option value="18">18</option> <option value="19">19</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> <option value="26">26</option> <option value="27">27</option> <option value="28">28</option> <option value="29">29</option> <option value="30">30</option> <option value="31">31</option> </select> <select id="stat_results_attributes_1_date_value_1i" name="stat[results_attributes][1][date_value(1i)]" class="year"> <option value="2010">2010</option> <option value="2011">2011</option> <option value="2012">2012</option> <option value="2013">2013</option> <option value="2014">2014</option> <option value="2015" selected="selected">2015</option> <option value="2016">2016</option> <option value="2017">2017</option> <option value="2018">2018</option> <option value="2019">2019</option> <option value="2020">2020</option> </select> <div class="bad-pad"> <span class="label label-danger">Bad:</span> <input name="stat[results_attributes][1][bad]" type="hidden" value="0" /><input type="checkBox" value="1" name="stat[results_attributes][1][bad]" id="stat_results_attributes_1_bad" /> </div> <div class="bad-pad"> <span class="label label-danger"> <input type="hidden" name="stat[results_attributes][1][_destroy]" id="stat_results_attributes_1__destroy" value="false" /><a class="remove_fields existing" href="#"> <span class="glyphicon glyphicon-trash"></span> Delete </a> </span>
解决方法
我注意到的问题
>(次要)您绑定单选按钮的点击事件,而不是更改事件.请注意,使用键盘填写表单的人将无法使用此功能.
>每当单选按钮改变时,您都会显示/隐藏页面上的所有日期字段.
>重用id属性的值.那些应该是页面上唯一的.我不认为这是你的问题,但它可能会导致奇怪的错误.切换到课堂.
这是我会推荐的
>将div中的每个“stat”包含在一个div中,表示它是平均值还是实例.即< div class =“stat average”>.>修改您的.erb以在div上输出正确的类名称(因此在页面首次加载时是正确的).>修改你的javascript以改变父div的类名($(this).closest(‘.stat’).removeClass(‘smoot’).addClass(‘instance’);)>设置css规则以隐藏平均统计数据的日期字段(.stat.averaged .day {display：none;})
