Apply for Zend Framework Certification Training

ReactJs




< Create registration form in reactjs Last >



Login Steps

1)Pass validation for other fields except email and password

Registration.jsx

useEffect(()=>{

        if(location.pathname.split('/')[1] =='login'){

            getform_name('Login form')

            getbutton_name('Login')

            getlinkContent('Not registered yet ?')

            getlinkText('Click here')

            getlinkvalue('registration')

               getfirstname('ffgfgfg')

            getlastname('tttttt')

            getmobileno('444444')

        }

})

 

const handleSubmit = (event)=>{

    if(firstname == ''){

            getformError("Enter your first name")

        }else if(lastname == ''){

            getformError("Enter your Last name")

        }else if(mobileno == ''){

            getformError("Enter your Mobile no")

        }else if(email == ''){

            getformError("Enter your Email")

        }else if(password == ''){

            getformError("Enter your Password")

        }else{

            getformError('')

            let formData = {firstname:firstname,lastname:lastname,mobileno:mobileno,

                                    email:email,password:password}

            if(params.id){

                axios.put('https://api.uncodecart.com/users/updateuser/'+params.id,formData).then((response)=>{

                    console.log(response)

                    navigate('/userlist')

                });

 

            }else if(location.pathname.split('/')[1] =='login'){

                axios.post('https://api.uncodecart.com/users/login',formData).then((response)=>{

                    if(response.data.message =='Either password or email is wrong'){

                        getformError('Either password or email is wrong')

                    }else{

                        navigate('/userlist')

                    }

                });

            }else{

                axios.post('https://api.uncodecart.com/users/registration',formData).then((response)=>{

                    navigate('/login')

                });

                getfirstname('')

                getlastname('')

            }

        }

}

At registration.jsx

if(location.pathname.split('/')[1] =='login'){

                axios.post('https://api.uncodecart.com/users/login',formData).then((response)=>{

                    if(response.data.message =='Either password or email is wrong'){

                        getformError('Either password or email is wrong')

                    }else{

                        localStorage.setItem('firstname',response.data.message[0].firstname)

                        localStorage.setItem('email',response.data.message[0].email)

                        localStorage.setItem('users_id',response.data.message[0].users_id)

                        navigate('/userlist')

                    }

                });

 

At header.jsx

    const firstname_ls = localStorage.getItem('firstname')

        const [loginstorage,setLoginstorage]= useState(firstname_ls)

    console.log(loginstorage)

        const handleLogout= ()=>{

            localStorage.clear()

            navigate('/login')

        }

    {loginstorage == null && 

            <>

                <li><a onClick={()=>{navigate('/login')}}>Login</a></li>

            </>

            }

            {loginstorage != null && 

            <>

                <li><a onClick={()=>{handleLogout()}}>Welcome {firstname_ls} ( Logout )</a></li>

                <li><a onClick={()=>{navigate('/userlist')}}>Userlist</a></li>

            </>

        }

 

< Create registration form in reactjs Last >



Ask a question



  • Question:
    {{questionlistdata.blog_question_description}}
    • Answer:
      {{answer.blog_answer_description  }}
    Replay to Question


Back to Top