how to detect a mouse click, enter key or tabbed i

Question

What is the best way to get the selected item value from a dropdown list box when the user does one of the following;

hits the tab key on the item,

presses the enter key or

mouse clicks the item.

Do I have to create a javascript event handler for each event or is there a good way to do it with knockout.

Are there any good jsfiddle examples I could look at?

thanks

Answer 1

You could use a custom binding that catches those events.

ko.bindingHandlers.tabEnterClick = {
    init: function(element, valueAccessor) {
        $(element).click(function() {
            valuAccessor()();
        }).keydown(function(event) {
            if (event.which == 13 /*enter*/ || event.which == 9 /*tab*/) {
                valuAccessor()();
            }
        }
    }
};

But if you just want to know the selected item from a dropdown, the value binding does that just fine.