0

The validity property of an HTML input does not seem to work in Firefox.

var input = $input.get(0);
console.log(input.validity)

This console log returns an empty object. It's working on Chrome and Safari and I think it's also suppose to work on Firefox if I look at that doc?

https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement

Any ideas?

TylerH
  • 20,799
  • 66
  • 75
  • 101
  • it's a jQuery input element that I get from a function. $input.get(0) is to get the html element and not the jquery element. –  Jan 02 '14 at 21:16
  • I tried to [reproduce](http://jsfiddle.net/Mp8f9/) your problem, but could not. Try including the minimum test case required to **fully** reproduce the issue. – Quentin Jan 02 '14 at 21:17
  • 1
    If you try an [individual property](https://developer.mozilla.org/en-US/docs/Web/API/ValidityState), such as `input.validity.valid`, does it log a value? – Jonathan Lonowski Jan 02 '14 at 21:17
  • @JonathanLonowski Oh that works! I don't understand why though ^^. Why does validity return an empty object? –  Jan 02 '14 at 21:21
  • 2
    @Maxwell Firefox is likely only rendering [`enumerable`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty) properties (i.e. those that would appear in a `for..in` loop) while each of the `ValidityState`'s properties are probably `enumerable: false`. – Jonathan Lonowski Jan 02 '14 at 21:23

2 Answers2

1

If it's appearing as an empty object, it's likely because only enumerable properties are being rendered, which ValidityState's properties don't seem to be in Firefox.

But, you should still be able to access individual properties:

console.log(input.validity.valid);   // true/false
console.log(input.validity.tooLong); // true/false
// etc.
Jonathan Lonowski
  • 121,453
  • 34
  • 200
  • 199
0

input.validity returns a special object, not just a simple boolean.

So, use input.validity.valid to check if an inputted value is correct.

See this JSFiddle to see validity properties.

And this MDN Article about the ValidityState object.

And as far as debugging in Firefox, Firebug shows this kind of stuff.

Robbie Wxyz
  • 7,671
  • 2
  • 32
  • 47