2016-09-01 12 views
3

現在のページでliの動的属性をactiveにしたいとします。私はこのトピックを見た:How to get Twitter-Bootstrap navigation to show active link?しかし、私のために働いていない解決策。私はパーシャルビューのための特定のコントローラを持っていません。メソッドcurrent_pageはhrefでは機能しません。私は定義されたルートを使用しないので、link_toを持っていません。1ページのブートストラップWebサイトで動的アクティブliを取得する

data-toggle = "pills"を使用しようとしましたが、ナビゲーションバーの現在のマークはリンクをクリックしましたが、参照(変更されていないビュー)は表示されませんでした。

li 
     a.waves-effect.waves-light href="#{root_path}#slider" Home 
    li 
     a.waves-effect.waves-light href="#{root_path}#about" About us 
    li 
     a.waves-effect.waves-light href="#{root_path}#price" Price 
    li 
     a.waves-effect.waves-light href="#{root_path}#contact" Contact 

答えて

5

Twitter Bootstrapタブはデフォルトで「1ページ」で、あなたの場合はすぐに動作するはずです。あなたは親を確認してください<ul>。それは、本質的に新しいページが開きますので、あなたは、あなたのリンクでroot_pathを必要としない、とあなたは、単一ページ

あるので、あなたはそれを望んでいない:

<ul class="nav nav-tabs"> 
    <li class="active waves-effect waves-light"> 
    <a href="#slider" data-toggle="tab">Home</a> 
    </li> 
    <li class="waves-effect waves-light"> 
    <a href="#about" data-toggle="tab">About us</a> 
    </li> 
    <li class="waves-effect waves-light"> 
    <a href="#price" data-toggle="tab">Price</a> 
    </li> 
    <li class="waves-effect waves-light"> 
    <a href="#contact" data-toggle="tab">Contact</a> 
    </li> 
</ul> 

注:あなたのコードは、次のようにする必要があります

関連する問題