1

Twitter/Bootstrap ドロップダウンのスタイルが適切に設定されていないという問題があります。私は Rails 3 で、bootstrap-sass gem を使用しています。ドロップダウンは適切に機能し、ボタンをクリックすると表示されますが、スタイルが設定されていません。

基本的には次のようになります。

次のように表示される場合: working

これら 2 つのスクリーンショットは、約 2 か月前に同じコード ベースからフォークされた別のアプリのものです。それらは同一のカスタム CSS スタイルを持ち、ドロップダウンに影響を与えるべきではありません。機能しているものはアラート、折りたたみ、ドロップダウン、モーダル、およびトランジション ブートストラップ プラグインのみをインポートしていますが、壊れたものはオールインワン ブートストラップを使用しています。 js. bootstrap.js を削除して、それらのプラグインのみに置き換えようとしましたが、問題は解決しません。

ドロップダウンも同じように呼び出され、ローカルでパーシャルをレンダリングします。

レンダリング:

<%= render :partial => 'layouts/dropdown', :locals => { :space => true, :collection => @statuses, :title => "Set Status", :subtitle => "Statuses:", :label => ->s{s}, :value => ->s{"&status=" + s}, :path => set_status_tickets_path, :id => "ticket-status", :type => :note } %>

パーシャル:

<div class="btn-group pull-right toggleCheck" style="display:none;" id='<%= id %>'>
  <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"><%= title %><span class="caret"></span></a>
  <ul class="dropdown-menu" style="right: 0; left: auto;">
      <% if type == :search %>
        <li style="padding:5px 10px;"><input class="drop-search focus-open hold" type='text' placeholder='Search' style="margin:0px;"></li>
      <% elsif type == :note %>
        <li style="padding:5px 10px;"><textarea placeholder='Status notes' class="hold focus-open note-box" rows="4" style="margin:0px; resize: none;"></textarea></li>
      <% end %>
    <li style="padding:5px 10px; font-weight:700;"><%= subtitle %></li>
    <div class="choices">
    <% collection.each do |c| %>
      <li><%= link_to (label.(c) + '<span class="comment"></span>').html_safe, '#', :value => value.(c), :path => path, :iden => label.(c).downcase.gsub(/\s/, '-') %></li>
    <% end %>
    </div>
  </ul>
</div>

ここで私が間違っているかもしれないことに誰かが光を当てることができますか? また、これは私の最初の質問です。何か間違ったことをしたり、十分な情報が含まれていなかったりした場合はお知らせください。ありがとう！

4

1 に答える 1

0

私はそれを理解しました、問題はにありました<div class="choices">。何らかの理由で、あるプロジェクトでは からスタイルを継承していませんでしたが、dropdown-menu別のプロジェクトでは継承していました。

このchoicesクラスは javascript 関数によって (選択のために) 使用されるため、それを取り除くことはできませんでした。ややぎこちない解決策としてchoices、適切な場所でブートストラップの CSS にクラスを追加しただけです。

于 2013-05-29T20:10:01.053 に答える