How my select list become uneditable?

Question

Hi everybody,

I am coding some sort of booking system - calendar. One of the features is also a (js) pop up window with detailed information about event - user can either view them or edit.

Now my problem - I have put there a HTML select control (dropdown box), quite simple - 5 options. But somehow, and I have no ide why, this select is uneditable - that means that after I click on it nothing happens (I do not get the list of the options).

I know that now I should put a code here, however, whole system is so complex that it would take me ages.

I do not await exact answer or solution of my problem. I would like to ask you for advice - what would you check? I went through CSS up and down - no clue at all. Maybe some javascript? But how? I do use one public js library, so it might be something there, I checked as well, no clue.

Any advice would be much appreciated. I am stuck now... :-(

Thanks a lot! Peter

::EDIT::

I have found out what is was! The ID if that pop-up window is bbit-cal-buddle and there is this line in the .js:

$("#bbit-cal-buddle").mousedown(function(e) { return false });

which basically explains why I can't select anything in dropdown (funny thing - checkboxes and radio works!). So my question is: how do I exclude my select and option tag from that .js command?

Answer 1

I've found a useful option when the bug is that obscure is to logarithmically comment your code.

That is,

1. Comment 100% of the code that might be causing a problem.
2. Test
3. If it works, uncomment 50% of the code you commented and go to step #2.
4. If it doesn't work, you know the problem exists in the code you uncommented.

Yes, this is somewhat of a monolothic technique, but I've found it to be very useful in the past.

Regards,

-Doug

Answer 2

Just to be sure, turn off ALL styles. this will render your page without the styles(obviously) and check if you can click the drop down. If you can, it is 98% a CSS error. It happened to me awhile ago - most probably an absolutely positioned div is covering it.

If you still can't click it, bring back the CSS then disable all javascripts. It should still be clickable by then since and html select tag doesnt need JS to be clickable.

If it still doesn't work, try doing a regular html select tag and check if you can select that one. If you can, then there is something wrong with your select tag