title: Change readonly attribute of input element: ReactJS
body: <p>I want to add or remove an attribute from an html input element.</p>
  
  <p>What i'm done is this:</p>
  
  <pre><code>constructor(props) {
      super(props);
      this.state = {inputState: 'readOnly'};
  }
  </code></pre>
  
  <p>And the render function:</p>
  
  <pre><code>&lt;input className="form-control" type="text" value={floor} {...this.state.inputState} /&gt;
  </code></pre>
  
  <p>As you can see i want set the "readOnly" attribute on the input element.
  But now i get an error which says:</p>
  
  <blockquote>
    <p>Unknown props <code>0</code>, <code>1</code>, <code>2</code>, <code>3</code>, <code>4</code>, <code>5</code>, <code>6</code>, <code>7</code> on  tag. Remove these props from the element</p>
  </blockquote>
  
  <p>When an user is clicking on the input element it should become editable, so i want to dynamicly change this attribute.</p>
  
  <p>But how can i do that?</p>