title: echo data through ajax function to a table
body: <p>I am trying to use the ajax function to echo out the data submitted to a table. But it did not turn out the way i wanted it to be. The values became a string of values which i do not want that to happen, i want the value to be in a table form.</p>
  
  <p>Below is my code for the form,</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="formbox"&gt;
    &lt;form id="formTable"&gt;
  
      &lt;table class="table table-hover"&gt;
        &lt;thead&gt;
          &lt;tr&gt;
            &lt;th&gt;Start Time&lt;/th&gt;
            &lt;th&gt;End Time&lt;/th&gt;
            &lt;th&gt;Monday&lt;/th&gt;
            &lt;th&gt;Tuesday&lt;/th&gt;
            &lt;th&gt;Wednesday&lt;/th&gt;
            &lt;th&gt;Thursday&lt;/th&gt;
            &lt;th&gt;Friday&lt;/th&gt;
            &lt;th&gt;Saturday&lt;/th&gt;
            &lt;th&gt;Sunday&lt;/th&gt;
            &lt;th&gt;&lt;/th&gt;
          &lt;/tr&gt;
        &lt;/thead&gt;
  
        &lt;tbody&gt;
          &lt;tr&gt;
            &lt;th&gt;
              &lt;input type="text" class="form-control" name="startTime" id="starttime" width="50px"&gt;
            &lt;/th&gt;
            &lt;th&gt;
              &lt;input type="text" class="form-control" name="endTime" id="endtime"&gt;
            &lt;/th&gt;
            &lt;th&gt;
              &lt;input type="checkbox" name="Monday" value="1" id="monday"&gt;
            &lt;/th&gt;
            &lt;th&gt;
              &lt;input type="checkbox" name="Tuesday" value="1" id="tuesday"&gt;
            &lt;/th&gt;
            &lt;th&gt;
              &lt;input type="checkbox" name="Wednesday" value="1" id="wednesday"&gt;
            &lt;/th&gt;
            &lt;th&gt;
              &lt;input type="checkbox" name="Thursday" value="1" id="thursday"&gt;
            &lt;/th&gt;
            &lt;th&gt;
              &lt;input type="checkbox" name="Friday" value="1" id="friday"&gt;
            &lt;/th&gt;
            &lt;th&gt;
              &lt;input type="checkbox" name="Saturday" value="1" id="saturday"&gt;
            &lt;/th&gt;
            &lt;th&gt;
              &lt;input type="checkbox" name="Sunday" value="1" id="sunday"&gt;
            &lt;/th&gt;
            &lt;th&gt;
              &lt;input type="button" class="btn btn-success" value="Add" id="send"&gt;
            &lt;/th&gt;
          &lt;/tr&gt;
        &lt;/tbody&gt;
      &lt;/table&gt;
  
    &lt;/form&gt;
  &lt;/div&gt;
  &lt;table class="table table-hover"&gt;
    &lt;thead&gt;
      &lt;tr&gt;
        &lt;th&gt;Start Time&lt;/th&gt;
        &lt;th&gt;End Time&lt;/th&gt;
        &lt;th&gt;Monday&lt;/th&gt;
        &lt;th&gt;Tuesday&lt;/th&gt;
        &lt;th&gt;Wednesday&lt;/th&gt;
        &lt;th&gt;Thursday&lt;/th&gt;
        &lt;th&gt;Friday&lt;/th&gt;
        &lt;th&gt;Saturday&lt;/th&gt;
        &lt;th&gt;Sunday&lt;/th&gt;
        &lt;th&gt;&lt;/th&gt;
      &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody&gt;
      &lt;div id="comment"&gt;&lt;/div&gt;
    &lt;/tbody&gt;
  &lt;/table&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>My javascript code,</p>
  
  <pre><code>  $(document).ready(function() {
  
      function showComment() {
        $.ajax({
          type: "post",
          url: "registerarray.php",
          data: "action=showcomment",
          success: function(data) {
            $("#comment").html(data);
          }
        });
      }
      showComment();
  
      $("#send").click(function() {
  
        var starttime = $("#starttime").val();
        var endtime = $("#endtime").val();
  
        if (document.getElementById('monday').checked) {
          var monday = $("#monday").val();
        }
        if (document.getElementById('tuesday').checked) {
          var tuesday = $("#tuesday").val();
        }
        if (document.getElementById('wednesday').checked) {
          var wednesday = $("#wednesday").val();
        }
        if (document.getElementById('thursday').checked) {
          var thursday = $("#thursday").val();
        }
        if (document.getElementById('friday').checked) {
          var friday = $("#friday").val();
        }
        if (document.getElementById('saturday').checked) {
          var saturday = $("#saturday").val();
        }
        if (document.getElementById('sunday').checked) {
          var sunday = $("#sunday").val();
        }
  
  
  
        var dataString = "starttime1=" + starttime + "&amp;endtime1=" + endtime + "&amp;monday1=" + monday + "&amp;tuesday1=" + tuesday + "&amp;wednesday1=" + wednesday + "&amp;thursday1=" + thursday + "&amp;friday1=" + friday + "&amp;saturday1=" + saturday + "&amp;sunday1=" + sunday + "&amp;action=addcomment";
  
        $.ajax({
          type: "post",
          url: "registerarray.php",
          data: dataString,
          success: function(data) {
            showComment();
            $("#formTable")[0].reset();
  
          }
  
        });
  
      });
    });
  </code></pre>
  
  <p>My register array codes, to register and to echo the data from the database,</p>
  
  <pre><code>&lt;?php
  
  $action = $_POST["action"];
  
  if ($action == "showcomment") {
  
      require_once 'dbfunction.php';
      $con = getDbConnect();
  
      if (!mysqli_connect_errno($con)) {
          $show = "SELECT * FROM scheduletime";
  
          $result = mysqli_query($con, $show);
  
          while ($row = mysqli_fetch_array($result)) {
              echo "&lt;tr&gt;";
              echo "&lt;th&gt;" . $row["startTime"] . "&lt;/th&gt;";
              echo "&lt;th&gt;" . $row["endTime"] . "&lt;/th&gt;";
              echo "&lt;th&gt;" . $row["Monday"] . "&lt;/th&gt;";
              echo "&lt;th&gt;" . $row["Tuesday"] . "&lt;/th&gt;";
              echo "&lt;th&gt;" . $row["Wednesday"] . "&lt;/th&gt;";
              echo "&lt;th&gt;" . $row["Thursday"] . "&lt;/th&gt;";
              echo "&lt;th&gt;" . $row["Friday"] . "&lt;/th&gt;";
              echo "&lt;th&gt;" . $row["Saturday"] . "&lt;/th&gt;";
              echo "&lt;th&gt;" . $row["Sunday"] . "&lt;/th&gt;";
              echo "&lt;th&gt;&lt;/th&gt;";
              echo "&lt;/tr&gt;";
          }
  
          mysqli_close($con);
      } else {
          echo "Failed to connect to MySQL: " . mysqli_connect_error();
      }
      ?&gt;
  
  
      &lt;?php
  
  } else if ($action == "addcomment") {
      require_once 'dbfunction.php';
      $con = getDbConnect();
  
      $starttime2 = $_POST['starttime1'];
      $endtime2 = $_POST['endtime1'];
      $monday2 = $_POST['monday1'];
      $tuesday2 = $_POST['tuesday1'];
      $wednesday2 = $_POST['wednesday1'];
      $thursday2 = $_POST['thursday1'];
      $friday2 = $_POST['friday1'];
      $saturday2 = $_POST['saturday1'];
      $sunday2 = $_POST['sunday1'];
  
      if (mysqli_connect_errno($con)) {
          echo "Failed to connect to MySQL: " . mysqli_connect_error();
      } else {
          $query = "INSERT INTO scheduletime (startTime, endTime, Monday, Tuesday, Wednesday, Thursday, Friday, Saturday, Sunday)" .
                  "VALUES ('$starttime2', '$endtime2', '$monday2', '$tuesday2', '$wednesday2', '$thursday2', '$friday2', '$saturday2', '$sunday2')";
  
          mysqli_query($con, $query);
      }
      echo "Your comment has been sent";
      mysqli_close($con);
  }
  </code></pre>
  
  <p>The current out put that i receive is a long string of data linked together and not imputed into the table.</p>
  
  <p>I would want the string of values to be inserted into the table accordingly. </p>