Avatar of Luey
LueyFlag for United States of America asked on

html5 validation messages fixed position

I am using html5 required on form fields.  My form is long so the page scrolls.  When I test the validation the error messages have a fixed position and do not scroll with the page.  Is that a bug or am I doing something wrong.

<div>
<label for="company_name" class="text_field_18_label">Company Name</label></br>
<input id="company_name" class="text_field_18" name="company_name" required type="text" size="30" maxlength="50"/>
    </div>

Open in new window

HTML

Avatar of undefined
Last Comment
Luey

8/22/2022 - Mon
Gary

Two lines of code are not enough, where is the css or a link to the page
ASKER
Luey

Here is a fiddle I found on a forum.  Others have the same problem.
Fiddle

hit the submit button then scroll up and down.
Gary

But when you scroll the page the validation disappears.
Your help has saved me hundreds of hours of internet surfing.
fblack61
ASKER
Luey

Chrome disappears ,  Firefox does not.
ASKER CERTIFIED SOLUTION
COBOLdinosaur

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
See how we're fighting big data
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question
Gary

And it is disappearing for me too in all latest browsers
ASKER
Luey

So in older browsers it makes you look like an idiot.  Is that what you are saying.
Get an unlimited membership to EE for less than $4 a week.
Unlimited question asking, solutions, articles and more.
Gary

You shouldn't be relying on HTML5 features when there are a lot of people using non HTML5 browsers.
If it's sticking it maybe due to your browser version when HTML5 features were only being brought in
What version are you using?
Scott Fell

You may be happier with using a javascript/jquery validation.  

The validation in your sample will only point out the last field that did not have proper info.  Try it with many fields http://jsfiddle.net/LSF5h/2/

 However, never rely on any client side validation.  Serverside, I duplicate the same validation created client side and display errors without updating the db if there are any.

@Cd&  +10 for the newsletter!
ASKER
Luey

I always use server side validation.  I have always relied on javascript for my client side validation but was trying to make the switch to html5.  I guess I will just stop testing in old browsers.  Thanks
This is the best money I have ever spent. I cannot not tell you how many times these folks have saved my bacon. I learn so much from the contributors.
rwheeler23