Mottie/Keyboard

Keyboard for date fields

AnReZa opened this issue · 5 comments

I realized, that if you put the on-screen keyboard on a date type field, it will crash. It is not possible to close that keyboard by tapping enter or continue. The app/site is stuck then.

$input = $("<input>")
  .attr("type", isDate ? "date" : "text")
  .addClass("form-control")
  .val(fieldValue)
  .keypress(function(e) {
    if (e.which === 13) dlgSettings.okHandler();
  });

$input.keyboard({
  layout: "german-qwertz-1",
  stickyShift: false,
  beforeVisible: function(e1, keyboard, el) {
    keyboard.$keyboard.appendTo(dlg.getBodyElement());
  },
  accepted: dlgSettings.okHandler
});

The input field is contained in a bootstrap modal. The okHandler method closes this modal.

Here's the error message from the browser console:

jquery.keyboard.min.js:2 Uncaught DOMException: Failed to set the 'selectionStart' property on 'HTMLInputElement': The input element's type ('date') does not support selection.
at w.fn.init.y.fn.caret (http://localhost:51124/Scripts/keyboard/js/jquery.keyboard.min.js:2:45815)
at Function.b.caret (http://localhost:51124/Scripts/keyboard/js/jquery.keyboard.min.js:2:42123)
at y.keyboard.h.setFocus (http://localhost:51124/Scripts/keyboard/js/jquery.keyboard.min.js:2:3715)
at HTMLButtonElement. (http://localhost:51124/Scripts/keyboard/js/jquery.keyboard.min.js:2:15172)
at HTMLButtonElement.i (http://localhost:51124/Scripts/keyboard/js/jquery.keyboard.min.js:2:13417)
at HTMLDivElement.dispatch (http://localhost:51124/Scripts/jquery-3.3.1.min.js:2:41772)
at HTMLDivElement.y.handle (http://localhost:51124/Scripts/jquery-3.3.1.min.js:2:39791)

Hi @AnReZa!

Please see this comment: #753 (comment)

Essentially, the "date" type input is incompatible with this library.

Updated the FAQ

Maybe you could throw an error straight away, when the $input.keyboard() method is being called to initialize the virtual keyboard. In the current state, where the keyboard can be applied to inappropriate fields, the result looks like a bug rather than expected behavior.

Ah, yes you're right. It should throw an error right away.

This fix is to be considered a breaking change since previously, the preview for a number type input would be converted automatically into a text type input.