0

Bootstrapを介してカスタムラジオボタンを作成したい。私はそれを行いましたが、このコントロールをapplication_helperに追加したいと思います。

私の現在の解決策

<div class="btn-group" data-toggle="buttons-radio">
      <% @engines2.each do |e| %>
        <button type="button" class="btn <%= @car.engine_id == "#{e.id}".to_i ? 'active' : '' %>" data-toggle="button" onclick="javascript:document.getElementById('car_input_engine_id').value='<%= "#{e.id}" %>'">
            <%= "#{e.name}" %>
        </button>
      <% end %>
      <input type="hidden" id="car_input_engine_id" name="car[input_engine_id]" value="<%= @car.engine_id %>" />
 </div>

望ましい使用

<%= form_for @car, :method => "post" do |f| %>
  <%= checkbox_bootstrap_tag(@engines2, @car.engine_id) %>
    <%= f.submit "Test Post", :class => "btn btn-inverse" %>
<% end %>

ヘルパー

 def checkbox_bootstrap_tag(engines, car_engine_id)   
    content_tag :div, :class=>"btn-group", "data-toggle"=>"buttons-radio" do
      engines.each do |e|
        content_tag :button, :type => :button,
        :class=>'btn #{car_engine_id == #{e.id}.to_i ? "active" : ""}',
        "data-toggle"=>"button", 
        :onclick=>"javascript:document.getElementById('car_input_engine_id').value=#{e.id}" do
           e.name       
        end
      end
      content_tag :input, :type => :hidden, :id=>"car_input_engine_id", :name=>"car[input_engine_id]", :value=>car_engine_id
    end
  end

しかし、それは機能しません。何か案は？

4

1 に答える 1

1

このフラグメントを見てください：

  engines.each do |e|
    ...
  end

何かを実行しますが、その後にもう1行あるため、結果はなくなります。

content_tag :input, :type => :hidden, :id=>"car_input_engine_id", :name=>"car[input_engine_id]", :value=>car_engine_id

engines.each ...したがって、ofとこの行の結果の両方の結果を連結する必要があります。

そして、私はあなたがengines.map代わりに作ることを計画していたと思いますengines.each：タグの配列を取得するためにbutton。

次に、この行を修正する必要があります。

:class=>'btn #{car_engine_id == #{e.id}.to_i ? "active" : ""}',

補間（）を実行しようとして#{..}いますが、一重引用符で囲んでいます'..'。一重引用符と二重引用符が混在する文字列がある場合は、%[ ... ]（必要に応じて、または他の角かっこ[を使用できます）を使用できます。%{...}

またcontent_tag、のためにinputは適していません。inputタグにはどのようなコンテンツが必要ですか？そうです、コンテンツはまったくありません！したがって、tag代わりに単純なヘルパーを使用してください。

だから、これが私が得たものです：

def checkbox_bootstrap_tag(engines, car_engine_id)   
  content_tag :div, :class=>"btn-group", "data-toggle"=>"buttons-radio" do
    engines_html = engines.map do |e|
        content_tag :button, 
          :type => :button,
          :class=> %[btn #{car_engine_id == e.id ? "active" : ""}], 
          :data => {:toggle => "button"},
          :onclick=> "javascript:document.getElementById('car_input_engine_id').value=#{e.id}" do
            e.name       
        end
      end
    safe_join(engines_html) +
      tag(:input, :type => :hidden, :id=>"car_input_engine_id", :name=>"car[input_engine_id]", :value=>car_engine_id)
  end
 end

：の使用法に注意してくださいsafe_join。このヘルパーは、配列要素をHTMLマークアップとマージするのに役立ちます（出力前にそれらをエスケープしないようにするため）。

また:data => {:toggle => "button"},、Railsヘルパーがこの属性を認識していることも説明する必要があります。

于 2012-12-19T10:42:01.840 に答える