treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Input validation popup in Chrome

  • Hi guys,

    I have a question regarding a possible bug in Chrome

    I'm using nyroModal (http://nyromodal.nyrodev.com/) to open a modal window with a form inside of it. One of the input fields is type="email" so that the browser validates the input.

    My problem is, that when I click on the submit button Chrome sets the focus on the email field, but the littel tool-tip-balloon thingy isn't showing up. Chrome

    In every other browser I have tested, this works perfectly fine Firefox

    Sadly I can't provide you with the code right now, because the page I'm working on is password-protected for now and I wasn't able to recreate the whole thing in code-pen : (

    Does someone has an idea or a similar issue?

    Thanks in advance Marco

  • No problem for me with Chrome: http://jsfiddle.net/y6jsX/

    Did you set the required attribute on the field?

  • Without using the modal window of nyroModal it's fine on my end. May it's some z-index issue or something.

    To answer your question: the > reqired attribute is set, doesn't change anything.

    I try to replicate the problem to an open site and give you a link.

  • Alright, here you go: modalwindow problem

    On the top is the link that opens the modal-window, all fields are required and the last one is type="email".

    • Works in Opera and Firefox

    • Safari seems to ignore the validation part.

    • Chrome doesn't show the popup.