Working on a HTML control that more/less operates like a spreadsheet - with a matrix of editable data cells. When it comes to cells derived from a SELECT I'm having an issue getting the correct behavior when that type of cell is selected for edit:
If I render the Select using its default formatting (size = 0) then the user gets the out-of-place behavior of Select's Enter-key processing:
On the other hand, if the select is rendered as a listbox (ie, size = 3, for example) the Enter key behavior is exactly what I'm looking for (meaning, #2 and #3 on the above list are no longer required), but because the list is now displayed internally to the control (rather than as a pop-up) it blows up the cell/row sizing.
So, is there a way to "hook" into the 3rd Enter-key event above, or some other relatively straight-forward way to alter the Select's behavior when it comes to processing the Enter key?
NOTE: we are not using any 3rd party library (read: jQuery, et. al)
EDIT: here is the event listener (attached via typical "addEventListener(...)"
this.e_sKeyDown = function(control, event) {
switch(event.keyCode) {
case 13: // enter
control.blur()
break
case 27: // esc = reset selection to it previous value
control.setAttribute("data-cancelModify", "true")
control.blur()
break
}
}
2nd EDIT: per comments/suggestions, I've added/given this try:
this.e_sOnChange = function(control, event) {
control.blur()
}
That event will fire, but it fires for each of the different Option/s. In other words, it doesn't appear that I'll have any way to determine if that is the Option that the user actually intended for selection, or just one that was traversed along the way. To demonstrate, here is any example for jquery's site. Note how the text changes with each up/down, regardless of Enter-key:
http://api.jquery.com/change/
SOLVED: thanks to all the commenters for their suggestions. Indeed, the solution (for my situation anyway) was to add a "keyup" event listener into the mix. I can't say what browsers this will work in, but it is functional in the later versions of Chrome.
Per suggestions, the way to pick up the "hidden" Enter-key event is to add a "keyup" event listener; question has been edited to reflect the solution.
NOTE: this answer was only posted to close the question; please give credit where it is due - jesus.tesh and the rest of the commenters for their suggestions...
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With