last day (14 days later) » 

1:41 PM
0
A: HTML Select control behavior

hopkins-mattIt's a timing issue. Change: <select id="myList" onchange="onChanged()" onclick="onClicked()"> to: <select id="myList" onchange="onChanged()" onmousedown="onClicked()"> If the user opens the list and moves off the list without clicking, the list will not revert to original unless you call ...

 
Hi Matt, Thanks for your suggestion. For some reason in Firefox, the onChanged method never gets called. Ditto for IE. Chrome works nicely unless I select the same item again.(onChanged doesn't get called in that case). Ditto for Safari. I'll look more closely in a little while.
 
I looked a little further into it. Because each browser fires these events differently, the only solution I see right now is to check to see what browser is viewing the page and the bind the events according to the browser.
@PurpleLagoon Check out the update to my answer for the best solution I can see without browser sniffing.
 
Thanks, trying your suggestions now in concert with suggestions from @Thriggle below.
IE is a problem, the onChange event doesn't fire!
 
Yeah. You'll have to choose between FF and IE, unless you want to do browser sniffing.
 
I don't mind browser sniffing but how do I handle IE? onChange doesn't fire. Thanks
 
1:41 PM
@PurpleLagoon this update should take care of it... I think.
 
Awesome Matt. That did the trick. I really appreciate your help, hopefully this will help others as well.
 
@PurpleLagoon No problem! Don't forget to click the check mark below the number of votes for this answer, if you feel my answer is correct.
 
I have a follow up question. In changeList, when listopen is true, I am changing the text color grey of the selected item w/o issue. However, I am also trying to disable that item as well. Once I do that the list won't close again. This worked in an earlier iteration of my code. myList.options[myList.selectedIndex].setAttribute("disabled", "true");
 
2:29 PM
@PurpleLagoon Do you have a fiddle with the new code you've added?
 
No, never "fiddled" before, other than looking at your posts.
Maybe its time to set one up?
 
Yeah, if you go to my fiddle - jsfiddle.net/hopkins_matt/3m1syk6c. Add your code and then click update. It should change the URL. Then give me that URL and I can see your new code.
 
Also playing with text color as well - thanks
 
perfect! let me see whats going on
 
2:42 PM
What browser are you having issue in? It seems to be opening and closing fine in chrome.
 
firefox
and IE is hosed
 
So Firefox isn't firing the onchange event. This is normally because the selectIndex is not changing.
 
so should I explicitly call it after disabling my option?
Also, on the browsers where its working, on some of them I can still select the disabled option even though while hovering it skips over it.
 
It appear to be due to you setting the selection as disabled.
 
lame, huh? :-)
 
2:57 PM
Yeah. Here, you can see it here jsfiddle.net/hopkins_matt/tuwouhxe/2
If you comment out any time you set the disabled attribute to true, it works fine.
 
I know, the reason I am trying to disable the item is to prevent the issue where if re-select the selected item it won't leave verbose string as the selection. Maybe this is a$$ backwards?
I don't want to take so much of your time. I'll look for another approach.
BTW, where is the checkmark to indicate you answered my question?
 
No, it seems like it would be a good work around, but FireFox kind of throws a wrench in that. The bad part is FireFix also prevent the use of onmouseout to fix the issue.
If you look at the zero next to the top of my answer there should be a faint check mark by that zero.
 
Blows IE out of the water also, plus in some browsers/platforms you can still select the disabled item
Ok, thanks again Matt.
 
Yeah, but you can use onmouseout in IE I think. I'm pretty sure it was only FF that I couldn't get onmouseout to work in.
 
Found the big check mark - thanks again!
 
3:04 PM
Maybe one day, all the browsers will use the same implementation of the standards... maybe one day. ha ha. and no problem!
 
We've been using GWT (google web toolkit) which lets us code in Java and it takes care of the browser html and javascript. Rumor has it that GWT is going away
So until we find another toolkit - its back to coding in javascript for the client.
bye
 

last day (14 days later) »