Multiple inputs handling in react js

Question

I want to update a form, so that I have fetch data from backend and display in form.I have declare form data like

constructor()
    {
        super()
        this.state={
          organization:[],
          options:["IT service", "Design"],
          loading:true,
          modalIsOpen: false,
          formData:{
            org_name:'',
            org_code:'',
            org_type:'',
            org_category:'',
            org_location:'',
            org_registration:'',
        }
         
        }

Then my handleinput function

handleInputs = (e) => {
      this.setState ({
        formData:{
        [e.target.name]:e.target.value
        }
       });
    }

and my update url

 updateOrganization = async(e) =>
      {
       const org_id= 
        e.preventDefault();
       const res=await axios.put('http://localhost:8000/api/update_organization',this.state.formData);
       
      }

But have six input fields, but when I trying to submit form I got only one input. I am new in react js.Please Help me

lpizzinidev · Accepted Answer · 2021-11-25 13:09:07Z

2

Try to change your handleInputs function like this:

handleInputs = (e) => {
  this.setState({
    formData: {
      ...this.state.formData,
      [e.target.name]: e.target.value,
    },
  });
};

answered Nov 25, 2021 at 13:09

lpizzinidev

13.3k2 gold badges15 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Multiple inputs handling in react js

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related