0

Actually i wanted to show some successfull message after hitting signup button using axios post method so that i have used toastify module in react but only catch option is working then is not working ...i am stuck here i dont know what to do...so please help me to sort this... here is my code

import React from 'react';
import {useState} from 'react';
import axios from 'axios';
import {toast} from 'react-toastify'; 
import 'react-toastify/dist/ReactToastify.css';  
toast.configure();
function Regform(){
const [user,setInput]=useState({
    ecode:"",email:"",phone:"",password:"",cpassword:""
})
function Handle(event){
const {name,value}=event.target;
setInput(prevInput=>{
    return {
        ...prevInput,
        [name]:value
    }
})
}
function postData(event){
event.preventDefault();

const newNote={
    ecode:user.ecode,
    email:user.email,
    phone:user.phone,
    password:user.password,
    cpassword:user.cpassword
}

axios.post('http://localhost:4000/create',newNote)
.then( response => {
    toast('Successfull registration ');
})
.catch( error => {
    toast('Invalid registration ') ;
})

}
return (
    <>

    <form method="POST">
        <fieldset>
                <legend><i>Registration Form</i></legend>
        <input type="text" placeholder="employee code" name="ecode" value = 
{user.ecode} onChange={Handle} autoComplete="off"/><br/>
        <input type="email" placeholder="email" name="email" value ={user.email} 
onChange={Handle} autoComplete="off"/><br/>
        <input type="number" placeholder="phone" name="phone" value ={user.phone} 
onChange={Handle} autoComplete="off" /><br/>
        <input type="password" placeholder="password" name="password" value = 
{user.password} onChange={Handle}  autoComplete="off"/><br/>
        <input type="password" placeholder="confirm password" name="cpassword" value 
={user.cpassword} onChange={Handle} autoComplete="off" /><br/>
        <button onClick={postData}>Register</button>
        </fieldset>
  
    </form>
    </>
)
}

export default Regform;

and here is my backend code for the same and for database i have used cloud mongo db

const mongoose =require('mongoose');
const express=require('express');
const cors=require('cors');
const app=express();
app.use(cors());
app.use(express.json());
mongoose.connect("mongodb+srv://raushan: 
<password>@cluster0.ofx36.mongodb.net/nodeDB",{
useNewUrlParser:true,
useUnifiedTopology:true,
useCreateIndex:true
}).then( () => {
    console.log('Connected to database ')
})
.catch( (err) => {
    console.error(`Error connecting to the database. 
\n${err}`);
})

app.use("/",require("./routes/noder"));


app.listen(4000,()=>{
console.log('sever is running at a port no 4000')
})
Raushan Gandhi
  • 1
  • 3
  • well, your axios.post() is not successfull – Godev Jun 29 '21 at 15:40
  • No after hitting signup button axios.post() is working and actually data is inserted but no successful message promt but if a made some mistakes then catch is working and this message "invalid registration" prompt. that means only catch is working but then is not working – Raushan Gandhi Jun 29 '21 at 15:45
  • console.log the status from axios response -> not sure it's 200 – Godev Jun 29 '21 at 15:47
  • i have add console.log(response.status ) if promise is fulfilled but again nothing is printing and when i made some mistakes and add console.log(error.status) it is printing "undefined" that means then is not working but catch is working with some mistakes while data is inserting if promise is fulfilled...;) – Raushan Gandhi Jun 29 '21 at 16:03
  • Can you show the code you have used in your backend to create the user? – Lahiru Tennakoon Jun 30 '21 at 03:43
  • yeah sure i have attached my backend code you can go through it – Raushan Gandhi Jun 30 '21 at 12:20

0 Answers0