Mottie / Keyboard

Virtual Keyboard using jQuery ~
http://mottie.github.io/Keyboard/
Other
1.78k stars 723 forks source link

keystrokes not forwarded to keyboard in dialog #705

Closed lokeecoyote closed 5 years ago

lokeecoyote commented 6 years ago

I'm experiencing a problem with a keyboard attached to an input field in a JQuery UI Dialog. Keystrokes from the physical keyboard are not recognized. I have included the Typing extension and everything works fine if the input field is on my main page. But when the input is on a Dialog, nothing. Here's the js:

    $(".num-input-class").keyboard({
    layout: 'custom',
    customLayout: {
        'normal' : [
            '7 8 9',
            '4 5 6',
            '1 2 3',
            '. 0 x',
            '{bksp} {a} {c}'
        ]
    }
})
    .addTyping();

Also, when there are multiple inputs on the dialog clicking any of them momentarily opens the keyboard on that field, then shifts focus/keyboard to the first field on the dialog.

Mottie commented 6 years ago

Hi @lokeecoyote!

I'm not sure about the cause of the issue you're reporting. I have this demo which can be found on the main wiki page, and it appears to work for me.

As for the multiple inputs changing focus, I'm not sure why it's doing that. Would you please modify the demo I shared in the paragraph above to duplicate the problem?

lokeecoyote commented 6 years ago

I was not able to reproduce the problem in your demo, but I have determined that my issues go away if the dialog is not modal even tho this isn't a problem on your demo. Here's the code I use to initialize the dialog. If I uncomment, it breaks.

function initializeDialog(dialogClass) { $("." + dialogClass).dialog({ autoOpen: false, resizable: false, width: 1920, position: {my: "top center", at: "top center", of: window}, height: 944, hide: {effect: "fade", duration: 1000}, // modal: true, closeOnEscape: true }); } function initializeSizeKeyboard() { $(".tm-dialog-size-input").keyboard().addTyping(); } function popupSize() { initializeSizeKeyboard(); openDialog = $(".tm-dialog-size"); openDialog.dialog("open"); }

I'll keep experimenting and see if I can narrow it down.

Mottie commented 5 years ago

I'm guessing this issue has been resolved, so I'm going to close it. If you continue to have problems, please feel free to continue the discussion in this thread.