title: How to display Database Value In a Table?
body: <p><a href="https://i.stack.imgur.com/uFILc.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uFILc.png" alt="Why The Data Cant be displayed?"></a></p>
  
  <p>I need your help for solve my problem. I have problem while selected a data from database into a table tbody. I have try to made it and try to run it. but the data can't be displayed. I separated the file HTML, PHP, and Javascript in different file type. Please help me..! I would appreciated if you give me an example.</p>
  
  <p><strong>This is the HTML, PHP, and JQUERY CODE</strong></p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script language="javascript" type="text/javascript" src="jquery-1.6.2.js"&gt;&lt;/script&gt;
  &lt;script language="javascript" type="text/javascript" src="ajax.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;form name="table_s" id="table_s" class="table_s"&gt;
      &lt;table id="table_s" class="table_s"cellspacing='0' class="js-serial" border="2"&gt;
          &lt;thead&gt;
  
        &lt;tr&gt;
                  &lt;th&gt;&lt;center&gt;No.&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;S1&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;S2&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;S3&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;S4&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;S5&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;S6&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;S7&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;S8&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;S9&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;S10&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;S11&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;S12&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;Ambien&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;Average&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;Deff&lt;/center&gt;&lt;/th&gt;
                  &lt;th&gt;&lt;center&gt;Status&lt;/center&gt;&lt;/th&gt;
        &lt;/tr&gt;
  
          &lt;/thead&gt;
          &lt;tbody&gt;
            &lt;tr&gt;
  
            &lt;tr&gt;
              &lt;td id="td_s0"&gt;&lt;/td&gt;
              &lt;td id="td_s1"&gt;&lt;/td&gt;
              &lt;td id="td_s2"&gt;&lt;/td&gt;
              &lt;td id="td_s3"&gt;&lt;/td&gt;
              &lt;td id="td_s4"&gt;&lt;/td&gt;
              &lt;td id="td_s5"&gt;&lt;/td&gt;
              &lt;td id="td_s6"&gt;&lt;/td&gt;
              &lt;td id="td_s7"&gt;&lt;/td&gt;
              &lt;td id="td_s8"&gt;&lt;/td&gt;
              &lt;td id="td_s9"&gt;&lt;/td&gt;
              &lt;td id="td_s10"&gt;&lt;/td&gt;
              &lt;td id="td_s11"&gt;&lt;/td&gt;
              &lt;td id="td_s12"&gt;&lt;/td&gt;
              &lt;td id="td_s13"&gt;&lt;/td&gt;
              &lt;td id="td_s14"&gt;&lt;/td&gt;
              &lt;td id="td_s15"&gt;&lt;/td&gt;
              &lt;td id="td_s16"&gt;&lt;/td&gt;
            &lt;/tr&gt;
  
        &lt;/tbody&gt;
        &lt;/table&gt;
  &lt;input type="button" value="Click Here" id="ajaxButton"/&gt;
  &lt;div id="result"&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <pre class="lang-html prettyprint-override"><code>$(document).ready(function() {
      $("#ajaxButton").click(function() {
          $.ajax({
                type: "Post",
                url: "employee.php",
                success: function(data) {
                  var tr = "&lt;tr&gt;";
                      tr += "&lt;td&gt;"+data['no']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['sensor1']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['sensor2']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['sensor3']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['sensor4']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['sensor4']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['sensor6']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['sensor7']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['sensor8']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['sensor9']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['sensor10']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['sensor11']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['sensor12']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['ambien']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['average']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['deffiasi']+"&lt;/td&gt;";
                      tr += "&lt;td&gt;"+data['status']+"&lt;/td&gt;";
                      tr += "&lt;/tr&gt;";
                  $("#table_s tbody").append(tr);
                }
          }); 
      });
  });
  </code></pre>
  
  <pre class="lang-html prettyprint-override"><code>&lt;?php
  //connect to the mysql
  $db = @mysql_connect('localhost', 'root', '') or die("Could not connect database");
  @mysql_select_db('silo', $db) or die("Could not select database");
  
  //database query
  $sql = @mysql_query("select no,s_tanggal,silo,sensor1,sensor2,sensor3,sensor4,sensor5,sensor6,sensor7,sensor8,sensor9 from termocouple");
  
  $rows = array();
  while($r = mysql_fetch_assoc($sql)) {
    $rows[] = $r;
  }
  
  //echo result as json
  echo json_encode($rows);
  ?&gt;
  </code></pre>