1

I'm trying to enable custom keyboard navigation of a jqxGrid. I've got it working 99.9% of the way, but I can't get IE to select the highlighted/focused options in a select box.

I wanted to see if there was a way to detect the option that's being focused on in order to manually set the select value when I hit the enter key.

I've tried:

var optVal = $select.find('option:selected').val();
$select.val(optVal);

which just gets the previous val of the select element, and:

var optVal = $select.find('option:focus').val();
$select.val(optVal);

which gets nothing.

EDIT: Also, I can't bind events directly to my controls.

Jason
  • 57
  • 1
  • 8
  • Not sure for IE 9/10/11, but for IE 6-8 select is a system control and it has only change event. – Alex Dec 08 '14 at 15:08
  • I think your actual problem is unclear. What do you mean by "option that's being focused on"? Does this mean "the option that is currently highlighted when the dropdown list is expanded?" – Greg Burghardt Dec 08 '14 at 17:41
  • You can pick the option from native `select` by hitting `ENTER`, or just by scrolling the options with arrow buttons. Do you have a native `select` or is it a custom select in your case? – Teemu Dec 08 '14 at 19:20
  • It's a native select and yes, I mean the highlighted option when using the arrow keys. I believe jqxGrid is commandeering my keyboard events somehow. – Jason Dec 09 '14 at 02:58

1 Answers1

0

How about checking the target.event of the keyup event (try on the select or on the option) ?

$("myselect").keyup(function(e) {
    var code = e.which;
    if(code==13) {
        //check the event.target
    }
});

$("myselect option").keyup(function(e) {
    var code = e.which;
    if(code==13) {
        $("myselect").val($(this).val());
    }
});
Mathieu Labrie Parent
  • 2,598
  • 1
  • 9
  • 10
  • event.target returns the select instead of the option. Also, I can't bind events directly to my controls because I have to work within the jqxGrid controls. – Jason Dec 08 '14 at 17:21