title: JavaScript AJAX: Sending HTML Table to PHP
body: <p>What is the correct way of sending a HTML table to the PHP script via AJAX, please? My table has 10 rows and three four columns. The table is not too large but still it could be too much for one AJAX call.</p>
  
  <p>So here are my questions:</p>
  
  <ul>
  <li>Should the whole table content be sent via one AJAX request?</li>
  <li>Should I send the table content per table rows - 10 rows would be 10 AJAX calls?</li>
  <li>Should I encode the table values into JSON?</li>
  </ul>
  
  <p>If you have any directions to correctly submitting tables to PHP script via AJAX, that would really help.</p>
  
  <p>I use pure JavaScript and no JQuery.</p>
  
  <p>Thank you in advance.</p>
  
  <hr>
  
  <h2>UPDATE - SOLUTION:</h2>
  
  <p>For those, who are interested in fully working solution, here is the full sotuion that works well for me.</p>
  
  <p><em>JavaScript:</em></p>
  
  <pre><code>    // submit the table to the PHP script for processing
  BlacklistTable.prototype.submit = function()
  {
      var that = this;
  
      // get table ID
      var elementTable = document.getElementById('copyrightBlacklistTable');
  
      // create JSON object
      var jObject = [];
  
      // iterate through the table
      // rows
      for (var i = 0; i &lt; elementTable.rows.length; i++)
      {
          // create array within the array - 2nd dimension
          jObject[i] = [];
  
          // columns within the row
          for (var j = 0; j &lt; elementTable.rows[i].cells.length; j++)
          {
              jObject[i][j] = elementTable.rows[i].cells[j].innerHTML;
          }
      }
  
      var JSONObject = encodeURIComponent( JSON.stringify(jObject));
  
      var url = "PHP/updateBlacklist.php";
      var requestData = "&amp;blacklistObject=" + JSONObject;
  
      var XMLHttpRequestObj = FileResort.Utils.createRequest();
      XMLHttpRequestObj.open("POST", url, true);
      XMLHttpRequestObj.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
      XMLHttpRequestObj.send(requestData);
  
      // process return message
      XMLHttpRequestObj.onreadystatechange = function (event)
      {
          if (XMLHttpRequestObj.readyState == 4 &amp;&amp; XMLHttpRequestObj.status == 200)
          {
              alert(XMLHttpRequestObj.responseText);
              var responseJSON = eval('(' + XMLHttpRequestObj.responseText + ')');
  
              if (responseJSON.result == true)
              {
                  console.log("Success processing Blacklist Object");
              }
              else
              {
                  console.log("Error processing Blacklist Object");
              }
          }
      }
  
  };
  </code></pre>
  
  <p><em>PHP Script:</em></p>
  
  <pre><code>// debugging library
  include 'ChromePhp.php';
  
  // connect to the database
  require_once 'mysqlConnect.php';
  
  // get variable values stored in $_POST
  $blacklistObjectJSON = $_POST['blacklistObject'];
  
  //$data = json_decode($blacklistObjectJSON, true);
  $data = json_decode($blacklistObjectJSON, false);
  
  // testing accessing the imported table values
  echo $data[0][0];
  
  // close database connection
  mysqli_close($dbc);
  
  $array = array("result" =&gt; true);
  echo json_encode($array);
  </code></pre>