thenelson
asked on
HTML5 required attribute is working but not the tooltip
I have a very complicated and long form with many fields with the HTML5 required attribute. When I run the page from my local drive, the tooltip displays under any field that is empty. But when I publish the form and run it from my server, the empty fields highlight, the form does not submit but the tooltip does not display.
A simple form works fine with the required attribute on my web server.
Any idea what is causing this strange behavior?
Here is the form: www.barnwellmd.com/patients/IntakeQuestionnaire.htm
Note: I know I shouldn't use MS Word to create a form. One of these days, i will have time to redesign the form.
A simple form works fine with the required attribute on my web server.
Any idea what is causing this strange behavior?
Here is the form: www.barnwellmd.com/patients/IntakeQuestionnaire.htm
Note: I know I shouldn't use MS Word to create a form. One of these days, i will have time to redesign the form.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
My computer is substituting "Times New Roman" for both 'Wingdings' and 'Arial Narrow'. I don't have 'Arial Narrow' and I don't know why it's not using 'Wingdings'.
As for the 646 errors, your page is not HTML5 compliant. <!DOCTYPE html> invokes a specific set of HTML rules and your page is not following them. DOCTYPE defines the rules that a web browser uses to render a page.
As for the 646 errors, your page is not HTML5 compliant. <!DOCTYPE html> invokes a specific set of HTML rules and your page is not following them. DOCTYPE defines the rules that a web browser uses to render a page.
ASKER
I changed:
<script src="jquery.h5validate.js" ></script>
to:
<script src="http://jquery.bassistance.de/validate/jquery.validate.js"></script>
This took care of this problem.
Thanks!
I am definitely going to redesign the page but I am assuming this would take me a week or two not just a few hours unless someone has a shortcut or two to suggest.
Thanks everyone for your responses.
<script src="jquery.h5validate.js"
to:
<script src="http://jquery.bassistance.de/validate/jquery.validate.js"></script>
This took care of this problem.
Thanks!
I am definitely going to redesign the page but I am assuming this would take me a week or two not just a few hours unless someone has a shortcut or two to suggest.
Thanks everyone for your responses.
>week or two not just a few hours unless someone has a shortcut or two to suggest
Wax on.... wax off...
only practice makes it go faster. It does look daunting but I think once you get into it it will go fast and maybe a day. You have a lot of data and it probably takes longer to set up the receiving end of things.
When you do redesign, look into using tabs or a wizard for each section so you only see one section at a time. The button for "Send Section to Dr Barnwell" saves the data to the db, hides section 1 and displays section 2. Jquery can make this easy. You can use jquery ui tabs or http://www.jquery-steps.com/, http://www.dbarnes.info/jWizard/, https://github.com/conzett/jquery.quickWizard, http://thecodemine.org/
Wax on.... wax off...
only practice makes it go faster. It does look daunting but I think once you get into it it will go fast and maybe a day. You have a lot of data and it probably takes longer to set up the receiving end of things.
When you do redesign, look into using tabs or a wizard for each section so you only see one section at a time. The button for "Send Section to Dr Barnwell" saves the data to the db, hides section 1 and displays section 2. Jquery can make this easy. You can use jquery ui tabs or http://www.jquery-steps.com/, http://www.dbarnes.info/jWizard/, https://github.com/conzett/jquery.quickWizard, http://thecodemine.org/
ASKER
Scott,
Thanks!! I took a look at those references and they look great. I will definitely use one of them when I redo the form.
So I am thinking of deleting all the crap that MS Word stuck in and see what I get. If it is workable, I can modify it from there.
Thanks!! I took a look at those references and they look great. I will definitely use one of them when I redo the form.
So I am thinking of deleting all the crap that MS Word stuck in and see what I get. If it is workable, I can modify it from there.
Good luck!
Now will be a good time. The html that word generates is not meant for the modern web. The first thing I check is if there are any js errors by looking in chrome console or firebug. I don't see any other then a warning, "event.returnValue is deprecated. Please use the standard event.preventDefault() instead." but t his should not be an issue.
The next thing I look at is html validation and here is where you have some issues. http://validator.w3.org/ Looking at the 600 errors is a lot although many are repeated. Errors like, " Stray end tag span." or "A table row was 12 columns wide and exceeded the column count established by the first row (9)." can make a difference and break your validation.
I am going to check something else out too. But it may be you just need to really simplify your html and get it done right. You can spend a few hours to debug this or a few hours to get it done right. One option may cause future problems... I will get back to you in a few minutes.