title: ReactJS Martial UI - Autocomplete component getting populated but onclick isn't filtering my table
body: <p>i'm still getting use to React.  So here goes.</p>
  <p>I have an API that I made which is a list of Countries.  I have the API list being displayed on my webpage in a table.  I have added an autocomplete component from Martial UI and I have been able to get autocomplete component to display my list of Counties too.</p>
  <p>What I am trying to do is  - if I type a Country name in and then click the Country name I would like my table to be filter upon that click.</p>
  <p>Here is how my webpage looks currently</p>
  <p><a href="https://i.stack.imgur.com/G3K0x.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/G3K0x.png" alt="Here is how my webpage looks currently" /></a></p>
  <p>Now here is my code:</p>
  <p><a href="https://i.stack.imgur.com/31axX.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/31axX.png" alt="enter image description here" /></a></p>
  <p>Here is my table code:</p>
  <p><a href="https://i.stack.imgur.com/VZ1RM.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/VZ1RM.png" alt="enter image description here" /></a></p>
  <p>Here is my interface:</p>
  <p><a href="https://i.stack.imgur.com/g5E8R.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/g5E8R.png" alt="enter image description here" /></a></p>