Does parsley.js support type="number" fields that have leading zeros, like zip code? - parsley.js

We have a zip code field. Right now we have it as type="text", but that means that phones don't use the numeric keypad. But before, when we had it as a type="number" the leading zeros would disappear - I think because of Parsley.js. Does this sound right? Is there a parsley.js option that allows us to use the number type without removing leading zeros?

I am using type="tel" plus a pattern.

It's not because of Parsley, it's because of the spec.
Use type=tel and pattern="-?\d+"

Related

ng-minlength less than a whole number

I'm using the code below in an application:
<input type="text" class="form-control" ng-model="waste.Quantity" ng-required="true" ng-minlength="1" ng-pattern="/^([1-9]*[1-9][0-9]*)$/" />
As you can see I have validation set on minimum length 1
Unfortunately for me customers need to enter decimals i.e. 0.5 NOT just whole numbers.
Is it possible to validate so anything equal or over 0.1 is passed?
Many thanks in advance.
ng-minlenght restricts the number of characters not the actual value, ng-pattern is your problem it's validating to accept only integers. something like /^[0-9]+\.?[0-9]*$/ would accept decimals

Angular UI-Mask Letters, Numbers Only, no spaces

I'm new to Angular UI-Mask and I don't understand the documentation enough to do this.
I'm trying to limit a text input to lowercase letters and numbers, no spaces should be allowed.
I tried this:
<input type="text" ng-model="path" ui-mask="[a-z0-9]">
And that didn't work.
Also if they type in an uppercase character want it to just translate to lowercase.

setting a maskDefinitions item in ui-mask

I have added a maskDefinition on ui-mask and it is working great except it only allows me to enter one character in the input box. I need to be able to enter many characters.
This is the maskDefinition (the asterix in there is my attempt to permit many characters. The result is the same with or without the asterix.)
'N': /^[a-zA-Z0-9-' ]*$/
This is how I use it:
<input data-ng-model="demogItems.firstName" ui-mask="N" name="firstName" data-ng-required="true" />
It works great allowing upper and lower case letters, numbers, and 3 special characters (hyphen, apostrophe, and space) and no other special characters. But it only allows one of any of those. Also, the requirement is that the characters are allowed or not allowed, onKeyUp, not on onBlur.
How do I get this maskDefinition to allow many characters?
Each token in maskDefinition needs to match a single character in the input field. So you cannot use '*' in the regex for your 'N' token, as that would match multiple characters.
Since you want to be able to input a variable number of characters, you must set ui-mask to something like '?N?N?N?N?N' (repeat '?N' for as many maximum characters you would like to accept).
It's an ugly solution, but I could not find a better one with ui-mask.
I suggest you take a look at ui-number-mask instead. It has it's limitations as well, but it may suit you better.

Decimal as first character in a number input field

I have a <input type="number"></input> field and when I try to put in a decimal as the first character, it comes up as invalid (I have an ng-change firing).
.5 won't work, but 0.5 is valid. Is there something I can do about this?
Per the HTML spec, .5 is valid for <input type="number">.
So, you’re right, and the tool (browser? Angular?) that validation error’s originating from is wrong.
As far as how to deal with it—how to work around it—I don’t know what to suggest, but as someone who actually works on the specs for this stuff, I would like to ask you to please at least file a bug against whatever tool is (mis)performing the actual validation that’s causing you to see that message. If nobody takes time to report spec-conformance bugs like this (but instead everybody works around it by just putting, e.g., 0.5 to get past it), then the bugs never get fixed.
Anyway as far as evidence for my assertion that .5 is in fact valid: The HTML spec is pretty clear on this; see the section defining what a valid floating-point number is:
A string is a valid floating-point number if it consists of:
Optionally, a U+002D HYPHEN-MINUS character (-).
One or both of the following, in the given order:
A series of one or more ASCII digits.
Both of the following, in the given order:
A single U+002E FULL STOP character (.).
A series of one or more ASCII digits.
Optionally:
Either a U+0065 LATIN SMALL LETTER E character (e) or a U+0045 LATIN CAPITAL LETTER E character (E).
Optionally, a U+002D HYPHEN-MINUS character (-) or U+002B PLUS SIGN character (+).
A series of one or more ASCII digits.
Along with that evidence from the spec itself, here’s a record of other supporting evidence: There was in fact a time when the HTML spec didn’t allow .5 but instead required it to be written as 0.5; however, after a “Floating point numbers beginning with a dot should be valid and parsed correctly” bug was raised against the spec, the spec was subsequently changed (in 2011) to state what it currently states (that is, too allow, e.g., .5).
So, any tool that’s flagging .5 as an error likely has not been updated in this regard since 2011, and so it regardless is in need of its maintainer(s) to go back into their code & evaluate their code against the current spec requirements, to make sure they are conforming to the current spec.
I hope the above provides enough ammunition to use in raising a bug against the responsible tool.
If you want all the input numbers to be valid then you can set in your input field step to "any". It works all integers and decimals numbers. Like -
<input type="number" step="any" />

Parsley.js Override Default Type Mapping

I have a series of fields where they need to be validated as a number, not as an integer. I've tried a number of different methods to change the constraint from integer to number, but none seem to stick. I've resorted to modifying the parsley.js source to map type="number" to the number validator, not the integer validator. There has to be another way other than modifying the library source code. The fields need to be type="number" to ensure the numeric keyboard is default, but they are NOT integers, but numbers with decimals.
Below is an example field
<input type="number" id="intimes-hobbs" data-parsley-type="number" value="" placeholder="Hobbs" required>

Resources