Create a gist now

Instantly share code, notes, and snippets.

@soner8 /app.js
Created Apr 21, 2018

Embed
What would you like to do?
Password.js
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import logo from './logo.svg';
import './App.css';
import Author from './test';
import Password from './password';
class App extends Component {
render() {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<h1 className="App-title">Welcome to React</h1>
</header>
<p className="App-intro">
<Author name='maco' />
</p>
<p className="Form">
<Password />
</p>
</div>
);
}
}
export default App;
import React, {Component} from 'react';
var regularExpression1 = new RegExp(/^(?=.*[!@#$%^&*])[\w!@#$%^&*]{6,}$/);
var regularExpression = new RegExp (/^[\w*]{6,}$/);
class Password extends React.Component {
constructor(props) {
super(props);
this.state = {value: 'Entrez un mot de passe'};
this.handleChange = this.handleChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
}
handleChange(event) {
if(regularExpression1.test(event.target.value)){
this.setState({value: 'Mot de passe Fort'});
}
else if(regularExpression.test(event.target.value)){
this.setState({value : 'Mot de passe Moyen'});
}
else this.setState({value : 'Mot de passe Faible'});
}
handleSubmit(event) {
if(this.state.value == 'Mot de passe Faible'){
alert('Mot de passe trop faible');
event.preventDefault();
}
else
alert('Mot de passe enregistré');
event.preventDefault();
}
render() {
return (
<form onSubmit={this.handleSubmit}>
<label>
Password :
<input type="text" onChange={this.handleChange} />
</label>
<input type="submit" value="Submit" />
<div>
{this.state.value}
</div>
</form>
);
}
}
export default Password;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment