I want to redirect the user after submit the form in react JavaScript, example when user submit the form he/she redirect to google.com
or some other URL with he/she information what he/she entered in the input filed. I created simple with one filed and submit button.
Here my sample code
import React, { Component } from 'react';
import { withRouter } from 'react-router-dom';
class App extends Component {
state = {
firstName: '',
showName: false
}
inputHandler = (e) => {
let updatedName = e.target.value;
this.setState({ firstName: updatedName });
//console.log(updatedName);
}
onSubmitHandler = (e) => {
e.preventDefault();
this.setState({
showName: true
});
}
render() {
return (
<div>
<form
onSubmit={this.onSubmitHandler}>
<label>Enter the Name</label>
<input type="text"
name="firstName" onChange={this.inputHandler} value=
{this.state.firstName} />
<button type="submit" onClick={this.onSubmitHandler}>Submit</button>
{this.state.showName && <p>"FirstName: " {this.state.firstName}</p>}
</form>
</div>
);
}
}
export default (App);
You can redirect using the this.props.history.push method.
onSubmitHandler = (e) => {
e.preventDefault();
this.props.history.push('/dashboard')
}
onSubmitHandler = (e) => {
e.preventDefault();
this.setState({
showName: true
});
window.location.href = "someurl/somepage?var1="+this.state.var1+"&var2="+this.state.var2 + "......";
}
Checking(event) {
event.preventDefault();
if (this.state.username === "" || this.state.password === "") {
alert("Fields are required");
return;
}
if (this.state.username == "subrata" && this.state.password === "1234") {
this.props.history.push('/adminpanel')
return;
}else{
alert("Login Failed ! . Check Username and Password.")
}
console.log(`${this.state.username}`)
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.