Skip to content

Commit ad9ce42

Browse files
committed
Validate number rule added
1 parent 81b380e commit ad9ce42

4 files changed

Lines changed: 539 additions & 48 deletions

File tree

README.md

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414
- [Validate Email](#validate-email)
1515
- [Validate Pattern](#validate-pattern)
1616
- [Validate Phone Number](#validate-phone-number)
17+
- [Validate Number](#validate-number-input)
1718
- [Example Reactjs Code](#example-reactjs-code)
1819
- [Licence](#license)
1920
## Installation
@@ -272,6 +273,55 @@ ValidatePhone: {
272273
#### `isLandlineNumber`: a function that receives a boolean value indicating if the input is a landline number.
273274
#### `isMobileNumber`: a function that receives a boolean value indicating if the input is a mobile number.
274275

276+
#
277+
# Validate Number Input
278+
279+
#### This is a function to validate numbers input. This function can validate a number within a specified range, with a specified number of decimal places, and check whether it's an integer. This function also supports negative numbers and numbers in a specific base.
280+
281+
```javascript
282+
ValidateNumber: {
283+
284+
input: "my-number-input", // required
285+
when: "typing", // required
286+
287+
min: 0,
288+
max: 100,
289+
decimalPlaces: 2,
290+
allowNegative: false,
291+
integersOnly: false,
292+
base: 10,
293+
customErrorMessages: {
294+
invalidNumber: "Invalid number",
295+
range: "Number must be between 0 and 100",
296+
decimalPlaces: "Number must have no more than 2 decimal places",
297+
negative: "Negative numbers are not allowed",
298+
integersOnly: "Only integers are allowed",
299+
base: "Number must be in base 10",
300+
},
301+
onsuccess: () => {
302+
console.log("Validation succeeded!");
303+
},
304+
invalid: () => {
305+
console.log("Validation failed!");
306+
307+
},
308+
```
309+
310+
```html
311+
<input type="number" name="my-number-input" />
312+
```
313+
314+
#### `min` (optional): The minimum value of the number.
315+
#### `max` (optional): The maximum value of the number.
316+
#### `input`: The name of the input field to validate.
317+
#### `when`: The timing of the validation. Valid values are "onblur" and "typing".
318+
#### `decimalPlaces` (optional): The number of decimal places
319+
#### `allowNegative` (optional): A boolean value indicating whether negative numbers are allowed. Defaults to true.
320+
#### `integersOnly` (optional): A boolean value indicating whether the number must be an integer. Defaults to false.
321+
#### `base` (optional): The base of the number.
322+
#### `customErrorMessages` (optional): An object containing custom error messages. Valid properties are invalidNumber, range, decimalPlaces, negative, integersOnly, and base.
323+
#### `onsuccess` (optional): A callback function to execute when validation succeeds.
324+
#### `invalid` (optional): A callback function to execute when validation fails.
275325
276326
#
277327
# Example Reactjs Code

src/index.js

Lines changed: 176 additions & 18 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)