I get an blank page with an error Cannot POST /registration/step-two.
I'm trying to create multistep registration. Render function of my main component is as follows:
render() {
const languageReg = this.props.currentLanguage.default.registrationPage;
let stepOne = (this.props.params.id == 'step-one') ? <RegistrationFormStepOne actionSaveUser={this.props.actionSaveUser} currentLanguage={languageReg}/> : "";
let stepTwo = (this.props.params.id == 'step-two') ? <RegistrationFormStepTwo actionSaveUser={this.props.actionSaveUser} currentLanguage={languageReg}/> : "";
return (
<div className="sidebar-menu-container" id="sidebar-menu-container">
<div className="sidebar-menu-push">
<div className="sidebar-menu-overlay"></div>
<div className="sidebar-menu-inner">
<div className="contact-form registrationForm">
<div className="container">
<div className="row">
<div className="col-md-10 col-md-offset-1 col-md-offset-right-1">
{stepOne}
{stepTwo}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
);
}
In RegistrationFormStepOne I have function on click as follows :
handleClick(){
let data = {name: "stepOne", values: [this.state.user]};
this.context.router.push("/registration/step-two");
}
When I click on this button, the url is like it should be http://localhost:3000/registration/step-two
but I'm getting Cannot POST /registration/step-two
error.
When I type direct http://localhost:3000/registration/step-two it works fine.
I'm using reactNoConfiguration App
Any advice?
The problem was in the handle click function. I forgot to prevent default. I changed it to :
handleClick(event){
event.preventDefault();
let data = {name: "stepOne", values: [this.state.user]};
this.context.router.push("/registration/step-two");
}
and it worked.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With