0

我正在尝试用这种一般结构制作一个简单的表格：

o accept  o decline
[submit]

检查单选按钮接受并提交按下时，我希望它更改我的模型状态（此处称为要约）。但是，当检查按钮下降时，表格需要更改为这样的事情：

o accept  x decline
Please enter reason here: [text box]
[submit]

输入了拒绝的（强制）原因并按下提交，也会改变模型 Offer 的状态，但有所不同。

我目前无法让表单以我想要的方式显示。我正在使用 SimpleForm 并尝试过这样的事情：

<%= simple_form_for @offer do |f| %>
  <%= f.input accepts, as: :radio_buttons %>
  <%= f.input :r_comment, as: :text, :label => 'Please enter reason here:' , :input_html => { :rows => 2, } %>
  <%= f.button :submit %>
<% end %>

这当然行不通，因为没有为优惠定义“接受”方法或变量（而且不应该！）。至于动态显示输入文本框，我什至没有丝毫线索。

我很乐意为您提供任何帮助，

贵族般的

更新：simple_form 生成的 HTML

<div class="control-group radio_buttons optional">
  <label class="radio_buttons optional control-label">Accept?</label>
  <div class="controls">
    <label class="radio">
      <input class="radio_buttons optional" id="offer_accepts_decline" name="offer[accepts]" type="radio" value="Decline" />
      Decline
    </label>
    <label class="radio">
      <input class="radio_buttons optional" id="offer_accepts_accept" name="offer[accepts]" type="radio" value="Accept" />
      Accept
    </label>
  </div>

更新：为评论框生成 HTML

<div class="control-group text optional">
    <label class="text optional control-label" for="offer_r_comment">Reason for rejection:</label>
    <div class="controls">
        <textarea class="text optional" cols="40" id="offer_r_comment" name="offer[r_comment]" rows="2">
        </textarea>
    </div>
</div>
4

1 回答 1

0

我不是 formtastic 或 simple_form 的粉丝，但查看文档，您应该能够执行以下操作

# offer.rb
attr_accessor :accepts

# view
<%= f.input :accepts, as: :radio_buttons, collection: ['Decline', 'Accept'] %>

# js which can be placed inline or in the assets. let's use coffee
# you should also limit the selector below to include the class or the id of the
# radio buttons.  I'm also not familiar with the html generated by simple form so
# the selectors to show and hide should also be changed.
$ ->
  $(':radio').change ->
    if $(this).prop('checked')
      if $(this).val() == 'Accept'
        $('#offer_r_comment').show()
      else
        $('#offer_r_comment').hide()

更新：非咖啡版。您可以将其放在脚本标签中，然后将其放入视图中。

$(document).ready(function() {
  $(':radio').change(function() {
    if ($(this).prop('checked'))
      if ($(this).val() == 'Accept')
        $('#offer_r_comment').show();
      else
        $('#offer_r_comment').hide();
  });
});
于 2013-02-18T10:08:46.110 回答