title: Add SQL to function called 'onclick'
body: <p>I have a button called "Add" which relates to each person in a list. </p>
  
  <pre><code>  echo &lt;td&gt;&lt;input type=\"submit\" id=\"PlayerAdded".$id."\" value=\"Add\" 
    onclick=\"add('".$id."','".$name."','".$_SESSION['GameID']."');\"&gt;&lt;/input&gt;&lt;/td&gt;";
  </code></pre>
  
  <p>When "Add" is clicked, I want to add the persons details to a table (working fine), and also add a new row including their name and ID into a table in my DB (this is my problem).</p>
  
  <p>I am aware that PHP won't work in a JS function. I'm also aware that I should never access the database on my site from JS due to the security issues.</p>
  
  <p><strong>So how can I have a button which <code>onclick</code> calls a function which adds to the database?</strong></p>
  
  <p>I tried writing my function in PHP, but it wasn't doing anything when I clicked the button. See my function below:</p>
  
  <pre><code>function add(id,name,game){
      var t = ("&lt;/td&gt;&lt;td&gt;");
      var str = ("&lt;tr id='Players" + id + "'&gt;&lt;td&gt;")
      var ctr = ("&lt;/td&gt;&lt;/tr&gt;")
  
      var PID = ("&lt;input type = 'hidden' name='ID" + id + "' value='" + id + "'&gt;&lt;/input&gt;" + id)
      var Pnam = ("&lt;input type='hidden' name='Name" + id + "' value='" +  name + "'&gt;&lt;/input&gt;");
      var place = ("&lt;select name='Place" + id + "'&gt;&lt;option value='17'&gt;17th&lt;/option&gt;&lt;option value='16'&gt;16th&lt;/option&gt;&lt;option value='15'&gt;15th&lt;/option&gt;&lt;option value='14'&gt;14th&lt;/option&gt;&lt;option value='13'&gt;13th&lt;/option&gt;&lt;option value='12'&gt;12th&lt;/option&gt;&lt;option value='11'&gt;11th&lt;/option&gt;&lt;option value='10'&gt;10th&lt;/option&gt;&lt;option value='9'&gt;9th&lt;/option&gt;&lt;option value='8'&gt;8th&lt;/option&gt;&lt;option value='7'&gt;7th&lt;/option&gt;&lt;option value='6'&gt;6th&lt;/option&gt;&lt;option value='5'&gt;5th&lt;/option&gt;&lt;option value='4'&gt;4th&lt;/option&gt;&lt;option value='3'&gt;3rd&lt;/option&gt;&lt;option value='2'&gt;2nd&lt;/option&gt;&lt;option value='1'&gt;1st&lt;/option&gt;&lt;/select&gt;")
      var points = ("&lt;form action='leaderboards.php' method='post' target='_blank'&gt;&lt;input type='hidden' name='playerid' value='" + id + "'&gt;&lt;/input&gt;&lt;input type='hidden' name='name' value='" + name + "'&gt;&lt;/input&gt;&lt;input type='submit' value='View'&gt;&lt;/form&gt;");
      var cash = ("$&lt;input name='Cash" + id + "' placeholder=' 0'&gt;&lt;/input&gt;");
      var ticket = ("&lt;select name='Ticket" + id + "'&gt;&lt;option value='No'&gt;No&lt;/option&gt;&lt;option value='Yes'&gt;Yes&lt;/option&gt;");
      var del = ("&lt;input type='button' value='Delete' onclick='remove(" + id + ")'&gt; &lt;/input&gt;")
  
     $('#PlayerAdded').before(str+ PID + t + Pnam + name + t + place + t + points + t + cash + t + ticket + t + del + ctr);
  
  // This is where I want to insert into the db. Similar to 
        // &lt;?php
        // $sql = "INSERT INTO results (`col`, `col2`, `col3`) VALUES ('$id', '$name', '$game')"; 
        // mysqli_query($dbcon,$sql); ?&gt;
  //but I want to be able to do it inside this java script function.
  
    }
  </code></pre>