4.9.10 • Published 2 years ago

react-inputs-validation v4.9.10

Weekly downloads
937
License
MIT
Repository
github
Last release
2 years ago

react-inputs-validation

All Contributors

npm version Cdnjs example workflow react-inputs-validation Package Quality Coverage Status npm bundle size (minified + gzip) Join the chat at https://gitter.im/react-inputs-validation/Lobby GitHub license LICENSE 996.icu

A react component for form inputs validation. Online demo examples.

How to use

Usage

By NPM

npm install react-inputs-validation --save
import { Textbox, Radiobox, Checkbox, Select, Textarea } from 'react-inputs-validation';
import 'react-inputs-validation/lib/react-inputs-validation.min.css';
Make sure you have at least react@16.8.6 installed.
  "peerDependencies": {
    "react": ">= 16.8.6",
    "react-dom": ">= 16.8.6"
  }

By CDN (starting from v4.4.1)

<head>
 ...
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/react-inputs-validation/4.9.1/react-inputs-validation.min.css"/>
</head>
<body>
 <div id="root"></div>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.13.1/umd/react.production.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.13.1/umd/react-dom.production.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/react-inputs-validation/4.9.1/react-inputs-validation.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.21.1/babel.min.js"></script>
 <script type="text/babel">
    const App = React.memo(() => {
      const [value, setValue] = React.useState('');
      return (<Textbox value={value} onBlur={()=>{}} .../>)
    });
    ReactDOM.render(<App />, document.getElementById('root'));
 </script>
</body>

Live examples

Codesandbox Examples

  • Example of online demo form playground
  • Example of custom control(when check: false)
  • Example of custom function(when providing customFunc)
  • Example of custom function further control(when providing customFunc)
  • Example of custom locales(when providing window.REACT_INPUTS_VALIDATION['customErrorMessage'])
  • Example of phone and email validation(handled with customFunc)
  • Example of async checking username existence (Async checking for <Textbox> and <Textarea> only. Handled with customFunc)
  • Example of asyncMsgObj (when providing asyncMsgObj)
  • Example of AREA CODE select (with react-custom-flag-select)
  • Example of label animation

Basic Usage Examples

Online demo example

Demo source code

Documentation

1.x, 2.x, 3.x

4.x

[About intl locales support](/docs/v4-doc.md#custom-error-message) (Under Common questions)

Browser support

Tested on IE9+ and Chrome and Safari(10.0.3)

Donation

Thanks for donating me a donut!  ⁄(⁄ ⁄•⁄ω⁄•⁄ ⁄)⁄

Contributors ✨

Thanks goes to these wonderful people (emoji key):

This project follows the all-contributors specification. Contributions of any kind welcome!

reactinputinputsvalidatevalidationformtextboxselectcheckboxradiotextarea
@webrom1145/calendar@infinitebrahmanuniverse/nolb-react-in@everything-registry/sub-chunk-2562@getkevin.eu/kevin-ui@kevin.eu/kevin-uimy-app-package-jn
4.9.10

2 years ago

4.9.8

2 years ago

4.9.9

2 years ago

4.9.7

3 years ago

4.9.6

3 years ago

4.9.4

3 years ago

4.9.3

3 years ago

4.9.5

3 years ago

4.9.2

3 years ago

4.9.1

3 years ago

4.9.0

3 years ago

4.8.9

3 years ago

4.8.8

3 years ago

4.8.5

4 years ago

4.8.4

4 years ago

4.8.7

3 years ago

4.8.6

3 years ago

4.8.1

4 years ago

4.8.0

4 years ago

4.8.3

4 years ago

4.8.2

4 years ago

4.7.0

4 years ago

4.6.3

4 years ago

4.6.2

5 years ago

4.6.1

5 years ago

4.6.0

5 years ago

4.5.2

5 years ago

4.5.1

5 years ago

4.5.0

5 years ago

4.4.6

5 years ago

4.4.5

5 years ago

4.4.4

5 years ago

4.4.3

5 years ago

4.4.2

5 years ago

4.4.1

5 years ago

4.4.0

5 years ago

4.3.4

5 years ago

4.3.3

5 years ago

4.3.2

5 years ago

4.3.1

6 years ago

4.3.0

6 years ago

4.2.3

6 years ago

4.2.2

6 years ago

4.2.1

6 years ago

4.2.0

6 years ago

4.1.10

6 years ago

4.1.9

6 years ago

4.1.8

6 years ago

4.1.7

6 years ago

4.1.6

6 years ago

4.1.5

6 years ago

4.1.4

6 years ago

4.1.3

6 years ago

4.1.2

6 years ago

4.1.1

6 years ago

4.1.0

6 years ago

4.0.3

6 years ago

4.0.2

6 years ago

4.0.1

6 years ago

4.0.0

6 years ago

3.5.0

6 years ago

3.4.13

6 years ago

3.4.12

6 years ago

3.4.11

6 years ago

3.4.10

6 years ago

3.4.9

6 years ago

3.4.8

6 years ago

3.4.7

6 years ago

3.4.6

6 years ago

3.4.5

6 years ago

3.4.4

6 years ago

3.4.3

6 years ago

3.4.2

6 years ago

3.4.1

6 years ago

3.4.0

6 years ago

3.3.0

6 years ago

3.2.6

6 years ago

3.2.5

6 years ago

3.2.4

6 years ago

3.2.3

6 years ago

3.2.2

6 years ago

3.2.1

6 years ago

3.2.0

6 years ago

3.1.4

6 years ago

3.1.3

6 years ago

3.1.2

6 years ago

3.1.1

6 years ago

3.1.0

6 years ago

3.0.5

6 years ago

3.0.4

6 years ago

3.0.3

6 years ago

3.0.2

6 years ago

3.0.1

6 years ago

3.0.0

6 years ago

2.2.1

6 years ago

2.2.0

6 years ago

2.1.9

6 years ago

2.1.8

6 years ago

2.1.7

6 years ago

2.1.6

6 years ago

2.1.5

6 years ago

2.1.4

6 years ago

2.1.3

7 years ago

2.1.2

7 years ago

2.1.1

7 years ago

2.1.0

7 years ago

2.0.9

7 years ago

2.0.8

7 years ago

2.0.7

7 years ago

2.0.6

7 years ago

2.0.5

7 years ago

2.0.4

7 years ago

2.0.3

7 years ago

2.0.2

7 years ago

2.0.1

7 years ago

2.0.0

7 years ago

1.4.2

7 years ago

1.4.1

7 years ago

1.4.0

7 years ago

1.3.7

7 years ago

1.3.6

7 years ago

1.3.5

7 years ago

1.3.4

7 years ago

1.3.3

7 years ago

1.3.2

7 years ago

1.3.1

7 years ago

1.3.0

7 years ago

1.2.1

7 years ago

1.2.0

7 years ago

1.1.4

7 years ago

1.1.3

7 years ago

1.1.2

7 years ago

1.1.1

7 years ago

1.1.0

7 years ago

1.0.5

7 years ago

1.0.4

7 years ago

1.0.3

7 years ago

1.0.2

7 years ago

1.0.1

7 years ago

1.0.0

7 years ago

0.0.18

8 years ago

0.0.17

8 years ago

0.0.16

8 years ago

0.0.15

8 years ago

0.0.14

8 years ago

0.0.13

8 years ago

0.0.12

8 years ago

0.0.1

8 years ago