Solved

can't tab out of zip field

Posted on 2014-11-03
2
174 Views
Last Modified: 2014-11-04
I have this form here:http://www.kars4kids.org/donate_car.asp
and I am having a problem with I tab through typing each field in FIREFOX only, it doesn't tab out zip.
What might it be associated with that field that is causing that problem?
0
Comment
Question by:rivkamak
2 Comments
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 250 total points
ID: 40420439
It probably has something to do with this validation error:
Line 207, Column 181: Attribute x-autocompletetype not allowed on element input at this point.

That is one of the 36 errors reported by the HTML validator.  You should not expect a page to work perfectly id the code is that far off of the standards.

Cd&
0
 
LVL 109

Assisted Solution

by:Ray Paseur
Ray Paseur earned 250 total points
ID: 40421535
Interestingly, I can see the issue when I visit your web site, but if I make a complete copy of the HTML on my server, the problem does not appear and the tab works as expected.  This might suggest that there is some kind of interaction between JavaScript and that form field (I did not copy any of the JavaScript files, so anything without an explicit URL did not get included in the page).
http://iconoun.com/demo/temp_kars.html

Agree with COBOLdinosaur -- invalid markup is a certain way to create a debugging nightmare.  I would start by correcting all of those errors and warnings, then revisit the issue.
http://validator.w3.org/check?uri=http%3A%2F%2Fwww.kars4kids.org%2Fdonate_car.asp&charset=%28detect+automatically%29&doctype=Inline&group=0

You might also want to look at the JavaScript near the end.  Since I can't reproduce the error, I can't really test this idea, but these lines look kind of suspicious to me:

     <script type="text/javascript">
        var specialKeys = new Array();
        specialKeys.push(8); //Backspace
        $(function () {
            $(".numeric").bind("keypress", function (e) {
                var keyCode = e.which ? e.which : e.keyCode
                var ret = ((keyCode >= 48 && keyCode <= 57) || specialKeys.indexOf(keyCode) != -1);
                $(".error").css("display", ret ? "none" : "inline");
                return ret;
            });
            $(".numeric").bind("paste", function (e) {
                return false;
            });
            $(".numeric").bind("drop", function (e) {
                return false;
            });
        });
    </script>

Open in new window

0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Learn by example how to specify CSS selectors for Selenium WebDriver test automation software.
Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…

856 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question