CODEWITHSUNDEEP
phphtmlcssdrop-down-menutwitter-bootstrap
Ankur Sinha
Ankur Sinha

Reputation: 6669

Dynamic Dropdown List not working because of dropdown script

This is the problem I had initially. Bootstrap Responsive Navbar Problem

Then I got the solution which "wandarkaf" posted. It worked fine and solved my problem.

Now my problem is, I have a dynamic dropdown file upload system for my site. It works perfectly on localhost but not on webserver. I realized, the dropdowns in the second and third level do not appear because of the dropdown script I added to overcome the mobile navigational dropdown issue. Removing that solves the current problem but gives rise to the previous problem. And solving the previous problem gives rise to the current problem.

How do I solve both of them and make things work.

Here is the link for my file upload: Dynamic Dropdown File Upload

It's supposed to work like this: Example Choose the Computer Science Engineering Option! The others have been disabled by me.

Please help me overcome both the problems. Thank you.

Upvotes: 3

Views: 825

Answers (2)

Ankur Sinha
Ankur Sinha

Reputation: 6669

Okay so all of you. Though shapeshifter has been patient with me and helped me out to his best. Here is another solution to it.

Apparently, there is an issue with the latest version of Twitter Bootstrap 2.2.2 or whatever. What happens is when you use a bootstrap dropdown submenu, on touching the link from your touch devices, you do not get redirected to the link, instead the dropdown list or menu just toggles back and closes. So for time being, they asked to enter some codes and fix it (just like the above answer and many others found on github) but adding this code might sometimes disable your normal dropdown lists or give other issues. Something or the other keeps going wrong and also it doesn't work on ALL the touch devices. I have personally tried it on iPhones, Galaxies, Windows phones, Nokia, etc with the help of my friends.

So after surfing a lot of similar issues on GitHub, I found that many of them switched back to Twitter Bootstrap Version 2.0.4 which has no issues at all, neither with the dropdown nor with the touch devices. And the boostrap.js for this version works fine for all the devices without having the user to edit or make any changes.

If anyone face a similar problem, I have given you a fix for time being. Bootstrap developers are working on it. If you want the 2.0.4 version, here is the link: Twitter Bootstrap 2.0.4

Thanks all!

Upvotes: 1

shapeshifter
shapeshifter

Reputation: 2967

}(window.jQuery);

$(function () {
  $('html').on('click.dropdown.data-api', clearMenus)
  $('body').on('click.dropdown touchstart.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
       .on('click.dropdown.data-api touchstart.dropdown.data-api'  , toggle, Dropdown.prototype.toggle)
       .on('keydown.dropdown.data-api touchstart.dropdown.data-api', toggle + ', [role=menu]' , Dropdown.prototype.keydown)
});

Should be,

$(function () {
  $('html').on('click.dropdown.data-api', clearMenus)
  $('body').on('click.dropdown touchstart.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
       .on('click.dropdown.data-api touchstart.dropdown.data-api'  , toggle, Dropdown.prototype.toggle)
       .on('keydown.dropdown.data-api touchstart.dropdown.data-api', toggle + ', [role=menu]' , Dropdown.prototype.keydown)
});

}( window.jQuery );

Upvotes: 2

Related Questions