ZK CTRL Key or Hot Key creating issue with diffrent browsers?

Question

I have implemented a CTRL Key listener in the ZK framework. However, I am having an issue with Firefox and Chrome.

If I press CTRL+R or CTRL+A or CTRL+S, my application event fires but in Firefox and Chrome, the default CTRL event fires also; refresh, select all, and save respectively. For example, if I press CTRL+A, my event is fired and all text on the page is selected.

Can anyone tell me if its a ZK issue or if I am doing something wrong.

Note: Events are fired for the whole page not only for the textbox.

In ZUL I used:

<window apply="org.zkoss.bind.BindComposer"
        viewModel="@id('vm') @init('com.web.viewmodel.MyViewModel')"
        width="100%" height="100%" mode="embedded" ctrlKeys="^a^q^r^s^d"
        onCtrlKey="@command('doFireCtrlKeyEvent',code=event.getKeyCode())">

..and in my Java ViewModel I used the following, this method will catch the event and pass it to the corresponding ViewModel:

@Command
public void doFireCtrlKeyEvent(@ContextParam(ContextType.VIEW) Component view, @org.zkoss.bind.annotation.BindingParam("code") String ctrlKeyCode) {
    int keyCode = Integer.parseInt(ctrlKeyCode);
    String ctrlKey = "";
    switch (keyCode) {
    case 65:
        ctrlKey = "CTRL+A";
        break;
    case 81:
        ctrlKey = "CTRL+Q";
        break;
    case 82:
        ctrlKey = "CTRL+R";
        break;
    case 83:
        ctrlKey = "CTRL+S";
        break;
    case 68:
        ctrlKey = "CTRL+D";
        break;
    }

    Map map = new HashMap();
    map.put("ctrlKeyCode", ctrlKey);

    Tabpanel tabPanel = mainTab.getSelectedPanel();
    Tab tab = mainTab.getSelectedTab();

    Include inc = (Include) tabPanel.getChildren().get(0);
    if (inc != null) {
        if (inc.getFirstChild() instanceof Window) {
            Window win = (Window) inc.getFirstChild();
            Map maps = win.getAttributes();
            Binder bind = (Binder) maps.get("binder");
            if (bind == null)
                return;
            bind.postCommand("doCtrlKeyAction", map);
        }
        if (inc.getFirstChild() instanceof Hbox) {
            Hbox hbox = (Hbox) inc.getFirstChild();
            Map maps = hbox.getAttributes();
            Binder bind = (Binder) maps.get("binder");
            if (bind == null)
                return;
            bind.postCommand("doCtrlKeyAction", map);
        }
    }
}

Answer 1

This just the common behavior -- do both ctrlkeys and default action if nothing has the focus.

As a workaround, you can use another focusable component (say 'a') as second control keys listener, listening to click event of document and focus event of window, and focus the 'a' component to let it handle control keys if clicked on unfocusable components/window focused.

simple sample: http://zkfiddle.org/sample/f9ejg7/5-Ctrlkeys-prevent-default

Answer 2

I'm afraid it's not possible to change/disable the browser level keyboard controls from our application (read: from JavaScript); it's a security & usability issue.

There are plugins for both Firefox and Chrome (the latter is made by Google) to change these browser-level controls.. but that doesn't help you as you would need all your users to reconfigure their browsers.

Using native HTML elements, you get a lot of controls for free. For example: select all in text fields. If your use case can't work within those bounds then I'd suggest you shy away from this approach (or these keyboard commands) as it's a usability conflict.