Form pop-up with inputs navigation

Published 2014-03-30

Modal pop-up confirm with “correct” navigation through inputs.

Main functional requirements are:

  • When submitting a form OK / Enter - the callback function must be called with the value of the field

  • Clicking on Cancel or press the Esc should be call the function callback. Esc key to close the form should always, even if the message input field is not in focus.

  • Form should do modal affect, all other element on page must be unclickable.

  • Form always centered in middle, height of form has no matter

  • When form appears input field in focus and user have possibility use Tab / Tab-Shift for switch only inputs in the form.

See the Pen xuizw by qetr1ck-op (@qetr1ck-op) on CodePen.

Make my day: