title: How to selectively enable/disable button in a table in React JS?
body: <p>Im using React Table(<a href="https://react-table.js.org)in" rel="nofollow noreferrer">https://react-table.js.org)in</a> A REACT JS web app and I fetch data from an API and populate the table based on the data. In one column I have a button which is used to claim the support action. If the status is success(I have the status data from the API) for a particular row I want the button to be disabled. However if the status is failed I want the button to be active(Enabled). Im using only React and not using Redux for state management. How to selectively disable the button in a row based on the status field? My code is as shown below. </p>
  
  <pre><code>    columns: [
              {
                filterable: false,
                Header: 'Action',
                accessor: 'action',
                Cell: (e) =&gt; (
                  &lt;button
  
                      onClick={() =&gt; {
                        axios.get(URL, {
                          headers: {
                            'content-type': 'application/json',
                            'Id': user.dealerId,
                            'Name' : user.Name,
                          },
                          responseType: 'json',
                        })
                        .then((response) =&gt; {
                          let responseData = response.data.data;
                          //console.log(responseData);
                          console.log(e.original.status);
  
                          function getEmailList(input, email) {
                            var output = [];
                            for (var i=0;i&lt;input.length; ++i)
                              output.push(input[i][email]);
                            return output;
                          }
                          emailList = getEmailList(responseData, "email");
                          console.log(emailList);
                          axios({
                            method: 'post',
                            url: PostURL,
                            headers: {
                              'Content-Type' : 'application/json',
                              'Id': user.Id,
                              'Name' : user.Name,
  
                            },
                            data: {
                            'topic': 'details',
                            'message': {
                               'recipients': emailList,
                              'data': {
                                        'text': 'refresh',
                              },
                           'attachment': null,
                           'type': "",
                            },
                          },
                        })
                      .then((response) =&gt; {
  
                      });
                        });
                      }}
                      className="btn btn-primary"
                  &gt;
                  Claim
                  &lt;/button&gt;
                ),
              },
            ],
          },
        ]}
  </code></pre>