HTML + RoR dropdown not clickable on mobile

Question

      <div class="dropdown pull-right">
        <a id="dropdown" data-toggle="dropdown" aria-haspopup="false" aria-expanded="true">
          <%= theme_icon_tag "settings" %>
        </a>
        <ul class="dropdown-menu" aria-labelledby="dropdown" style="padding: 0.25em">
          <li><%= link_to "Edit", edit_book_review_path(review.book, review), class: "btn btn-outline-primary dropdown-item" %></li>
          <li><%= link_to "Delete", book_review_path(review.book, review), method: :delete, data: {confirm: "Are you sure?"}, class: "btn btn-outline-danger dropdown-item" %></li>
        </ul>
      </div>
    <% end %>
  <% end %>
</div>

This is my dropdown and it's working fine on desktop. Ive got my phone laying around and wanted to test it's functionality and I realized that I am not able to click the icon to open the dropdown-menu.

Why is that?

I think this will help you https://stackoverflow.com/a/17841690/6392696 — nourza, Oct 15 '18 at 08:23
Indeed, managed to solve this. Thank you my man. If I could I would give you my upvote! — flenning12, Oct 15 '18 at 09:06
I added a new answer please correct the answer if this work for you @flenning12 — nourza, Oct 25 '18 at 00:22

score 0 · Answer 1 · answered Oct 15 '18 at 17:33

0

This link will help you stackoverflow.com/a/17841690/6392696

Find this file bootstrap.min.js , In substring

"ontouchstart"

Replace it with

"disable-ontouchstart"

Hopefully this will help!

answered Oct 15 '18 at 17:33

nourza

2,215
2
16
42

HTML + RoR dropdown not clickable on mobile

1 Answers1