import React, { Component } from 'react' import './forms.css' import Axios from 'axios'; export default class Bupdate extends Component{ constructor(props){ super(props); this.state = { book_id: '', book_name: '', author: '', price: 0.0, } this.handleChange=this.handleChange.bind(this); this.update=this.update.bind(this); } handleChange (event) { this.setState({ [event.target.name]: event.target.value}); } update(event){ const book ={ book_id: this.state.book_id, book_name: this.state.book_name, author: this.state.author, price: Number(this.state.price), } Axios.post('http://localhost:5000/book/update/'+this.state.book_id,book) .then( window.alert("Book updated successfully!")) .catch(function(error) { window.alert("error" + error); }); event.preventDefault(); } render(){ return( <div> <h3 style={{fontFamily:"Roboto",marginLeft:"20px"}}> <b>BOOK UPDATION</b> </h3> <form> <ul style={{listStyle:"none"}}> <li><div> <input type="text" placeholder="Book_id" name="book_id" onChange={this.handleChange} required/> <input type="text" placeholder="book_name" name="book_name" onChange={this.handleChange} required/> </div></li> <li><div> <input type="text" placeholder="Author" name="author" onChange={this.handleChange} required/> <input type="text" placeholder="Price" name="price" onChange={this.handleChange} required/> </div></li> <li><div> <input type="submit" value="Update" onClick={this.update}/> </div></li> </ul> </form> </div> ); } }