Ruby on Rails 和 Ajax - 将数据库中的数据保存在一个按钮中答案

【问题标题】：Ruby on Rails and Ajax - persist the data from the database in a buttonRuby on Rails 和 Ajax - 将数据库中的数据保存在一个按钮中
【发布时间】：2012-07-26 01:43:50
【问题描述】：

我使用按钮组作为单选按钮来捕获数据库中布尔字段的用户输入。我有一个带有布尔字段的婚礼模型：rsvp。下面的表格似乎捕获了数据。但是，如果我刷新页面，按钮将不再随用户的选择进行切换。我的问题是，即使页面被刷新，或者如果用户注销并再次登录，如何让按钮保持用户的选择？

模型

 class User < ActiveRecord::Base
  has_one :wedding
 end

 class Wedding < ActiveRecord::Base
  belongs_to :user
 end

控制器

 class WeddingsController < ApplicationController

   def new
     @wedding = Wedding.new
   end

   def create
     @wedding = current_user.build_wedding(params[:wedding])
      if @wedding.save
       redirect_to root_path
     else
       render 'new'
     end
   end

 class StaticPagesController < ApplicationController
   def home
    @wedding = Wedding.new
   end

查看：

home.html.erb

  <%= form_for(@wedding, :remote => true) do |f| %>
     <div class="btn-group-wrap">
          <div class="btn-group" data-toggle="buttons-radio">
             <%= f.button 'Yes', :class => "btn btn-large btn", :value => "1", :name => "wedding[rsvp]" %>
              <%= f.button 'No', :class => "btn btn-large btn", :value => "0", :name => "wedding[rsvp]" %>
          </div>
     </div>
  <% end %>

【问题讨论】：

标签： ruby-on-rails ajax ruby-on-rails-3 forms

【解决方案1】：

我应该建议您使用单选输入，但隐藏圆圈（一些 css 会做到这一点）并在输入上添加引导类，以便您可以看到按钮。

查看其他帖子：How to make a radio button look like a toggle button

【讨论】：

【解决方案2】：

这就是我最终的做法（使用 Javascript）。不确定这是否是最好的方法。我为每个按钮添加了一个 ID 标签，然后使用 javascript 和一个取决于我的数据库中的值的条件来切换该按钮。

 <div class="btn-group" data-toggle="buttons-radio">         
        <%= f.button :rsvp, :id => "rsvp_true", :class => "btn btn-large btn", :value => "1", :name => "wedding[rsvp]" %>
        <%= f.button :rsvp, :id => "rsvp_false", :class => "btn btn-large btn", :value => "0", :name => "wedding[rsvp]" %>      
 </div>

 <script>
   $(document).ready(function() {
  <% if current_user.wedding.rsvp == true %>
    $('#rsvp_true').button('toggle');
  <% else %>
    $('#rsvp_false').button('toggle');
  <% end %>
   });
 </script>

【讨论】：