title: Update SQL value in Ajax and PHP
body: <p>I have a button like this:<br /></p>
  
  <pre><code>&lt;a id="MSN89" class="onButton"&gt;
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/0yolK.png" alt="enter image description here"></p>
  
  <p>I want to change it state to:<br /></p>
  
  <pre><code>&lt;a id="MSN89" class="offButton"&gt;
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/9aNhS.png" alt="enter image description here"></p>
  
  <p>By clicking on the first red button, I want to be able to save the value (MSM89 for example) to my sql database.</p>
  
  <p>By clicking on the second grey button, I want to be able to output the value (MSM89 for example) from my sql database.</p>
  
  <p>I tried to make it like this but it reloads the page all the time, and I have too much data, I can't reload it at every click...</p>
  
  <pre><code>UPDATE User
  SET cards='MSN89'
  WHERE User_Id='3';
  </code></pre>
  
  <p>I read <a href="https://stackoverflow.com/questions/3136160/jquery-ajax-sql-live-update-via-php-help">this</a>, but I do not how to implement it in my code.</p>
  
  <p>Thanks for pointing me in the right direction.</p>
  
  <hr />
  
  <p>I tried this type of code, but for sure this is nit the best way and it not refresh the page...</p>
  
  <pre><code>&lt;a id="MSN89" class="onButton"&gt;
  &lt;script&gt;
  $(".onButton").click(function() {
    // sql request
    ...
    UPDATE User SET cards='MSN89' WHERE User_Id='3';
    ...
  });
  &lt;/script&gt;
  </code></pre>
  
  <p><br /></p>
  
  <pre><code>&lt;a id="MSN89" class="offButton"&gt;
  &lt;script&gt;
  $(".offButton").click(function() {
    // sql request
    ...
    UPDATE User SET cards='' WHERE User_Id='3';
    ...
  });
  &lt;/script&gt;
  </code></pre>