Error of send data to blockchain application in React js

119 Views Asked by At

I have blockchain application and created Reactjs interface to send data from user to application but when i enter data and try send it get error as follow , any one can help me?

The error is :

XHR POST http://localhost:3000/api/MedicalRecord

[HTTP/1.1 422 Unprocessable Entity 19ms]

The App.js file as follow

import React, { Component } from 'react';
import PostForm from './PostForm'

  function App() {
   return (

  <div className="App">
     <PostForm></PostForm>
     </div>
);
   
  }

 export default App;
 

The PostForm.js file as follow

import React, { Component } from 'react'
import axios from 'axios'

class PostRecords extends Component {

  
constructor(props){
    super(props)
    
     this.state = {
         record_Id: "",
         patient: "",
         doctor: "",
         description: "",
         prescription: ""
  
     }
  }
  handleChange =(e) =>{
     this.setState({
         [e.target.name]: e.target.value
     })
 }
 handleSubmit = (e) => {
    e.preventDefault()
    axios.post('http://localhost:3000/api/MedicalRecord')
    .then(response =>{
        console.log(response)
    })

 }
   

render() {
    const {record_id, patient, doctor, description, prescription} = this.state
    return (
        <div>
            <form onSubmit={this.handleSubmit}>
            <div>
                <label>record_id :</label>
               <input
                type='text' 
                name ='record_id'
                value={record_id}
                onChange={this.handleChange}
                ></input>
            </div>
            <div>
                <label>patient :</label>
               <input
                type='text' 
                name ='patient' 
                value={patient}
                onChange={this.handleChange}
                ></input>
            </div>
            <div>
                <label>doctor :</label>
               <input
                type='text' 
                name ='doctor' 
                value={doctor}
                onChange={this.handleChange}
                ></input>
            </div>
            <div>
                <label>description :</label>
               <input
                type='text' 
                name ='description' 
                value={description}
                onChange={this.handleChange}
                ></input>
            </div>
            <div>
                <label>prescription :</label>
               <input
                type='text' 
                name ='prescription' 
                value={prescription}
                onChange={this.handleChange}
                ></input>
            </div>
            <button type='submit'>Submit Now</button>
            </form>
        </div>
    )
}
} 
export default PostRecords
 

0

There are 0 best solutions below