Skip to content Skip to sidebar Skip to footer

How To Send Input Data Taken Dynamically To The Server Using Post Request

i had taken the user inputs now i want to send them to the server using POST request which i can not able to send. i am only getting the values by the user and those can be seen b

Solution 1:

Try using following way

fetch('https://mywebsite.com/endpoint/', {
 method: 'POST',
 headers: {
  'Accept': 'application/json',
  'Content-Type': 'application/json',
},
body: JSON.stringify({
  firstParam: 'yourValue',
  secondParam: 'yourOtherValue',
 })
}); 

React require stringify post body data

Solution 2:

You can create your inputField like this:

<input className="form-control" type="text" value={this.state.userData.firstName} required placeholder="First Name" onChange={this.handleChange.bind(this, 'firstName')} />

In your form component, you can define userData state object in this way:

this.state= {
  userData: {
    firstName:null,
    lastName:null,
    ...
  }
}

And for handleChange(), we can make it to accept dynamic keys for state variables:

handleChange(key, e, value){
  let data = this.state.userData;
  userData[key] = e.target.value;
  this.setState({
    userData: data
  });
}

All you need to post then is this.state.userData.

Post a Comment for "How To Send Input Data Taken Dynamically To The Server Using Post Request"