CODEWITHSUNDEEP
reactjsredux-form
Tim
Tim

Reputation: 709

how to redirect to home page after submitting redux-form?

I have created a redux form, which when clicked on submit button doesn't redirect to the app.js page the url changes to this http://localhost:3000/?name=Cook&phone=45625465265&email=cook%40yahoo&work=Engineer&city=

this is what i have written-

form.js

const Form=({handleSubmit})=>(
  <form onSubmit={handleSubmit}>
    <center>
    <div>
      <label>First Name</label>
      <Field type="text" component="input" placeholder="Name" name="name"/>
    </div>
    <div>
      <label>Address</label>
      <Field type="text" component="input" placeholder="Phone" name="phone" />
    </div>
    <button type="submit">Submit</button>
  </center>
  </form>
)


export default reduxForm({
  form: 'form',
  fields: ['name', 'address']
})(Form);

add.js

class AddNew extends Component{
  handleSubmit = (values) => {
      console.log('This Values',values)
  }
  render() {


    return (
    <div style={{ padding: 150 }}>
      <Add onSubmit={this.handleSubmit}/>
    </div>
  )}
  }

Upvotes: 3

Views: 1567

Answers (1)

Shubham Khatri
Shubham Khatri

Reputation: 281726

In order to Redirect, what you can do is that in the handleSubmit function of AddNew component, you can call dynamic routing with this.props.history.push()

Now supposing your App.js is specified in the Routes with path /app

You can do the following

import {withRouter} from 'react-router'

class AddNew extends Component{

  handleSubmit = (values) => {
      console.log('This Values',values)
      this.props.history.push('/app');
  }
  render() {


    return (
    <div style={{ padding: 150 }}>
      <Add onSubmit={this.handleSubmit}/>
    </div>
  )}
  }

export default withRouter(AddNew);

Upvotes: 2

Related Questions