0

http://taskteam.herokuapp.com/welcome/faq

We're noticing that with Bootstrap 3, whenever we first load a page, clicking on page references (such as the accordion links) that you cannot repeat the action. So say you expand a FAQ. You can't close it.

But if you refresh the page - it suddenly works as intended. We also noticed this with our responsive design, and if you shrink the width of the page, our little menu icon also bugs out in a similar fashion. Refreshing the page fixes it.

According to this stackoverflow, its a jQuery and turbolink issue. But we have that gem and both locally and on heroku, it shows the same behavior. According to the console in chrome, jQuery is also being loaded before Bootstrapper as intended.

    <div class="accordion" id="myaccordion">

    <div class="accordion-group">
       <div class="accordion-heading">
          <a class="accordion-toggle" data-toggle="collapse" data-parent="#myaccordion" href="#first">
       What is TaskTeam? </a> </div>

        <div id="first" class="accordion-body collapse">
             <div class="accordion-inner">  This is our inside   </div>
        </div>

</div>
Community
  • 1
  • 1
user99999991
  • 1,351
  • 3
  • 19
  • 43

2 Answers2

1

You are using span

 div class="col-md-4" div class="span12"

this is bootstrap 2 in bootstrap 3 you should use col. This might be the problem.

Dznr
  • 81
  • 1
  • 4
  • where exactly? So make it div class="col-md-12" instead of span12? Why would it be that it works if you refresh the page because of that? I shall try it. – user99999991 Oct 08 '13 at 00:27
0

First, install jquery-turbolinks gem. And then, don't forget to move your included Javascript files from end of body of your application.html.erb to its <head>.

If you have put the application javascript link in the footer for speed optimization reasons, you will need to move it into the tag so that it loads before the content in the tag. This solution worked for me.

Aboozar Rajabi
  • 1,683
  • 21
  • 26