title: How to select only one checkbox in a group using reactjs component
body: <p>I have multiple category each category contains multiple checkbox, for which I want only 1 checkbox to be checked in every category at a time using React js.
  <a href="https://i.stack.imgur.com/v63iM.png" rel="nofollow noreferrer">This is what i want</a></p>
  
  <pre><code>onlyOne(event) {
      console.log("==",event.target.value)
      var checkboxes = document.getElementsByName('check')
      console.log("cheek",checkboxes);
      checkboxes.forEach((item) =&gt; {
        if (item !== event.target.name) item.checked = false
      })
  
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>       &lt;div&gt;
          &lt;label&gt;RBA CONFIGURATION SCREEN &lt;/label&gt;&lt;br/&gt;               
          View  &lt;input type="checkbox" name="check" value="0" onClick={this.onlyOne.bind(this)} checked=''/&gt;
          Manage  &lt;input type="checkbox" name="check" value="1" onClick={this.onlyOne.bind(this)} checked='' /&gt;
          Edit  &lt;input type="checkbox" name="check" value="2" onClick={this.onlyOne.bind(this)} checked='' /&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>Looking something like this in Reactjs 
  <a href="https://stackoverflow.com/a/37002762">https://stackoverflow.com/a/37002762</a>  </p>
  
  <p>Radio button can't be used because the user should be able to un-check the selection</p>