Hello all. Initially I had a problem. I designed my site using Twitter Bootstrap and I used a responsive navbar. The extreme right dropdown gives two options, faculty and student login (http://ankursinha.net/TestSite/index.php), which kept disappearing on touching the link when viewed on mobile phones and tablets. So I was asked to add this code to the bootstrap-dropdown.js file.

$(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)
Adding that solved my problem and everything worked fine on the phones and tablets.

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. This is the problem: http://ankursinha.net/TestSite/upload.php and this is how it must be: http://ankursinha.net/upload.php (choose the computer science engineering option)

Please help me overcome this issue.

Thank you