title: Select all checkbox of table on click of the another table checkbox using react
body: <p>I have checkboxes for each <code>td</code> in a table. Now, I have another table which has one checkbox. On checking this, I want to select all other checkboxes of first table.</p>
  
  <p>Here is the code,</p>
  
  <pre><code>&lt;tr key={key}&gt;
      &lt;td align="center"&gt; &lt;input type="checkbox" name="myTextEditBox" value="checked" /&gt;&lt;/td&gt;
      &lt;td&gt;{item.technology}&lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>for second table I did,</p>
  
  <pre><code>handleCheckBox = () =&gt; {
      console.log("callling the handle change");
      this.setState({
        isCheckd: !this.state.isCheckd
      })
  }
  
  constructure(props) {
      this.state = { isCheckd: false }
      &lt;td className="text-right mr-1"&gt;&lt;input type="checkbox" checked={this.state.isCheckd} onChange={this.handleCheckBox}  /&gt;&lt;/td&gt;
  }
  </code></pre>
  
  <p>Now, In this click handler works. But, now how do I select all other checkboxes of another table, without using jquery.</p>
  
  <p>Can any one help me with this ?</p>
  
  <p>Tried solution -</p>
  
  <pre><code>state = { dynamicProp: {},  isCheckd: false,}
  
      handleCheckBox = () =&gt; {
          this.setState({
            isCheckd: !this.state.isCheckd
          }, () =&gt; {
            this.props.jobs.forEach((item) =&gt;
              this.setState(prevState =&gt; ({
                dynamicProp: {
                  ...prevState.dynamicProp,
                  [item.jdName]: prevState.isCheckd
                }
              })
              ))
          });
        }
  
        handleTableCheckboxChange = (e) =&gt; {
          const target = e.target.name;
          const checked = e.target.checked;
          this.setState(prevState =&gt; ({
            dynamicProp: {
              ...prevState.dynamicProp,
              [target]: checked
            }
          }), () =&gt; {
            const result = this.allTrue(this.state.dynamicProp);
            this.setState({
              isCheckd: result ? false : true
            })
          })
        }
  
  
  
   allTrue(obj) {
      for (var o in obj)
        if (!obj[o]) return true;
      return false;
    }
  </code></pre>
  
  <p>and then passing all the props to the child element. Now, the problem I am facing now is in the handleTableCheckboxChange method where I am not getting the way you used filter to get the unchecked element. and then the select all check will get changed. </p>