IE10 Validation bug with maxlength and placeholder on textbox

validation internet-explorer-10 placeholder maxlength
sapataso picture sapataso · Apr 25, 2013 · Viewed 8.4k times · Source

I have a textbox for Age:

<input type="text" id="txtAge" name="txtAge" class="text" placeholder="Age (optional)" maxlength="2">

Upon clicking submit, this input is instantly bordered red. There is no postback. I'm assuming IE10 believes the client has actually typed in "Age (optional)" which is greater than the maxlength of 2.

Is there anyway to get around this without making the user do anything in their browser's settings and without removing the maxlength attribute?

Answer

Peter picture Peter · May 28, 2013

You can use the novalidate and formnovalidate attributes. See this link for more information.

Internet Explorer 10 and Windows Store apps using JavaScript add new support for HTML5 Forms, including new states of the type attribute (on the input element), new attributes for the input element, and the progress element. This support enables developers to quickly and easily provide user prompting, input validation, and feedback with a minimal amount of script.

Source: http://msdn.microsoft.com/en-us/library/ie/hh673544(v=vs.85).aspx

Related questions

How to validate an email address in JavaScript

Is there a regular expression to validate an email address in JavaScript?

Read More
How to allow only numeric (0-9) in HTML inputbox using jQuery?

I am creating a web page where I have an input text field in which I want to allow only numeric characters like (0,1,2,3,4,5...9) 0-9. How can I do this using jQuery?

Read More
Validate decimal numbers in JavaScript - IsNumeric()

What's the cleanest, most effective way to validate decimal numbers in JavaScript? Bonus points for: Clarity. Solution should be clean and simple. Cross-platform. Test cases: 01. IsNumeric('-1') => true 02. IsNumeric('-1.5') => true 03. IsNumeric('0') => true 04. …

Read More