0

I wan to create an array/object of name and value pair of multiple input fields like [{street: value1, city: value2}].

import Input from 'react-toolbox/lib/input';

handleChange(name,value) {
    var arr = [{[name]: value}];
}
<Input type='text' name='street' defaultValue={this.props.fieldValue} 
onChange={this.handleChange.bind(this,"street")} />
<Input type='text' name='city' defaultValue={this.props.fieldValue} 
onChange={this.handleChange.bind(this,"city")} />

I don't want to use react state. I have checked this: How to handle multiple controlled inputs with react es6? But there state has been used. Also followed this: How to add multiple form input results into array State in React.

I am guessing that, it can be resolved by lodash assign or Object.assign.

4
  • Just use this.handleChange.bind(this). Then use handleChange(event) and inside, get event.target; that's the <input>. Grab event.target.name and event.target.value for the name and current value. Commented Sep 23, 2017 at 10:13
  • @ChrisG Its updating every time. Means when I enter in city it returns {city: abc} and when I enter in street it returns {street: xyz}. While I wants it like this: {city: abc, street: xyz} Commented Sep 23, 2017 at 10:30
  • 1
    I see; all you need is arr[e.target.name] = e.target.value; Commented Sep 24, 2017 at 18:31
  • @ChrisG Yes, thanks. Resolved now. Commented Sep 25, 2017 at 6:30

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.