当使用PUT方法给出id时,如何更新表中的数据

时间:2018-06-15 04:39:55

标签: javascript node.js reactjs express

我想在给予药物时更新字段。但当我选择drugid为1并点击更新按钮时,它会显示:

  

'localhost:8081 / drug / 1'未找到。

在mongodb db中也有自动生成的_id列。当我使用邮递员并尝试使用mongo _id进行更新时,它可以正常工作。如何通过我的药物更新它。

UpdateDrugHandler .jsx

'use strict';

 import React, { Component } from 'react';
  import axios from 'axios';
   import UpdateDrugController from '../Controllers/UpdateDrugController';
   import PropTypes            from 'prop-types';


export default class UpdateDrugHandler extends Component {
// static get propTypes() {
//     return {
//         user: PropTypes.object
//     }
// }
constructor(props) {
  super(props);
//   this.user = this.props.user;

  this.state = {
     drugs: []
  };
  this.updateDrug = this.updateDrug.bind(this);
 }  
   updateDrug(drugid,drugname,drugqty,remark,drugtype,
   drugcreatedate,drugdosage,drugcreatedby,drugexpiration,drugprice){
   axios.put(`http://localhost:8081/drug/` + drugid ,{
    drugid:drugid,
    drugname:drugname,
    drugqty:drugqty,
    remark:remark,
    drugtype:drugtype,
    drugcreatedate:drugcreatedate,
    drugdosage:drugdosage,
    drugcreatedby:drugcreatedby,
    drugexpiration:drugexpiration,
    drugprice:drugprice


}).then(res=>{
    console.log(res);
})
 }
 render() {
  return <div>
       <UpdateDrugController
            updateDrug={this.updateDrug}
        />
  </div>
}
 }

UpdateDrugController.jsx

'use strict';

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

export default class UpdateDrugController extends Component {
constructor(props) {
    super(props);
    this.onSubmit = this.onSubmit.bind(this);
    this.state = {
        users: []
    }
        this.getAllUsers();

}

    onSubmit(event){
    event.preventDefault();
    this.props.updateDrug(
        this.drugid.value,
        this.drugname.value,
        this.drugqty.value,
        this.remark.value,
        this.drugtype.value,
        this.drugcreatedate.value,
        this.drugdosage.value,
        this.drugcreatedby.value,
        this.drugexpiration.value,
        this.drugprice.value,

    );
    this.drugid.value='';
    this.drugname.value='';
    this.drugqty.value='';
    this.remark.value='';
    this.drugtype.value='';
    this.drugcreatedate.value='';
    this.drugdosage.value='';
    this.drugcreatedby.value='';
    this.drugexpiration.value='';
    this.drugprice.value='';

   }

getAllUsers() {
    axios.get('http://localhost:8081/drug').then(res => {
        this.setState({
            users: res.data.data || res.data
        });
    })
}

render() {
    return <div>
        <div class="ui grid">
 <div class="three column row">
<div class="column"></div>


        <div class="ui icon message">
        <i class="inbox icon"></i>
        <div class="content">
            <div class="header">
            xxx
            </div>
            <p>Get the best news in your e-mail every day.</p>
        </div>
        </div>


        <form class="ui tiny form">
        <div class="ui compact message">
        <p>New Drugs</p>
        </div>
        <div class="field"><label>First Name</label><input maxlength="6" placeholder="DrugID" ref={drugid=>this.drugid=drugid}/></div>
        <div class="field"><label>First Name</label><input maxlength="6" placeholder="Drug Name" ref={drugname=>this.drugname=drugname}/></div>              
        <div class="field"><label>First Name</label><input maxlength="6" placeholder="Quantity" ref={drugqty=>this.drugqty=drugqty}/></div>              
        <div class="field"><label>First Name</label><input maxlength="10" placeholder="Remark" ref={remark=>this.remark=remark}/></div>              
        <div class="field"><label>First Name</label><input maxlength="6" placeholder="Drug Type" ref={drugtype=>this.drugtype=drugtype}/></div>              
        <div class="field"><label>First Name</label><input maxlength="6" placeholder="Created Date" ref={drugcreatedate=>this.drugcreatedate=drugcreatedate}/></div>              
        <div class="field"><label>First Name</label><input maxlength="6" placeholder="Drug Dosage" ref={drugdosage=>this.drugdosage=drugdosage}/></div>
        <div class="field"><label>First Name</label><input maxlength="6" placeholder="Drug Created" ref={drugcreatedby=>this.drugcreatedby=drugcreatedby}/></div>
        <div class="field"><label>First Name</label><input maxlength="6" placeholder="Drug Expiration" ref={drugexpiration=>this.drugexpiration=drugexpiration}/></div>
        <div class="field"><label>First Name</label><input maxlength="6" placeholder="Drug Price" ref={drugprice=>this.drugprice=drugprice}/></div>
        <div class="field"><label>First Name</label><button  class="ui primary button" onClick={this.onSubmit}>Update </button></div>
        </form>


        <div class="column">ssssssssssss</div>
        <div class="column">ssssssssssssssc</div>
        </div>
        </div>     

        </div>

}
}

0 个答案:

没有答案