-1

In application.html.erb file i have following code to show a tab controller.

<link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet" type="text/css" />
    <script src="http://code.jquery.com/jquery-1.7.1.js"></script>
    <script type="text/javascript" src="http://twitter.github.com/bootstrap/assets/js/bootstrap-tab.js"></script>


<div class="tabbable">
           <ul class="nav nav-tabs">
             <li class="active"><a href="https://www.google.co.in" data-toggle="tab">Individual</a></li>
             <li><a href="https://www.yahoo.com" data-toggle="tab">All</a></li>
           </ul>

        </div>

They appear correctly,and when clicking on the links the tabs changes .But the problem is href is not working.it is not redirecting .

divz
  • 7,847
  • 23
  • 55
  • 78
  • what are you trying to achieve? This code is incomplete. The tab `individual` is active by default and will remain active through out even if you click the tab `All`. You haven't changed the clicked tab by any means. – sjain Feb 27 '13 at 09:36
  • http://jsfiddle.net/SzVrs/21/ – divz Feb 27 '13 at 09:49
  • Please have a look at this..tabs are changing in click events.but not redirect to pages – divz Feb 27 '13 at 09:50

1 Answers1

2

This is because you have put the data-toggle="tab" in your link.

If you will remove the data-toggle="tab" from your code, the links will work.

But this is not the correct way to show because what you want is in a tab and this will open the link to the other site that you give in url.

The way is to define each of the link url path with some hash name and then to use that to call your url on click.

This you can do with a javascript. See this SO post for the way.

Community
  • 1
  • 1
sjain
  • 23,126
  • 28
  • 107
  • 185