Giala Jefferson
Giala Jefferson

Reputation: 1929

Altering react form but input value not editable

I came from angularjs background, with 2 way binding I don't have to worry much, just declare a submit function, I can get the changed or unchanged value.

I'm stuck with react now. My input is not editable.

class HelloWorldComponent extends React.Component {

  constructor(){
    super();

    this.handleChange = this.handleChange.bind(this)
  }

  render() {
    const person = {"name":"james"};
    return (      
      <input onChange={this.handleChange} type="text" placeholder="name" value={person.name} />      
    );
  }

  handleChange(e){

  }
}

React.render(
  <HelloWorldComponent />, document.getElementById('react_example')
);

http://jsbin.com/huluqifanu/1/edit?js,console,output

Also what to do next? should I set the api data to a state first?

Upvotes: 0

Views: 434

Answers (1)

patrick
patrick

Reputation: 10273

If you do not want to use Controlled Components then you can use Uncontrolled Components.

Specifically, you can use the defaultValue prop instead of value on your input.

As to your second question, you will have to be more clear what you are asking or perhaps better to ask in a separate Q altogether.

Upvotes: 2

Related Questions