【问题标题】:how to display database value using json encode in a tbody of table如何在表的 tbody 中使用 json 编码显示数据库值
【发布时间】:2017-03-07 20:09:09
【问题描述】:

我正在尝试使用 JSON 编码显示数据库值,但我不知道如何在我在 HTML 表单中设置的表中显示它。有人知道该怎么做吗?如果你能给我一个例子,我将不胜感激。

这是我的表格和我的 PHP 函数。

<?php 

  //--------------------------------------------------------------------------
  // Example php script for fetching data from mysql database
  //--------------------------------------------------------------------------
  $host = "localhost";
  $user = "root";
  $pass = "";

  $databaseName = "silo";
  $tableName = "temp1";

  //--------------------------------------------------------------------------
  // 1) Connect to mysql database
  //--------------------------------------------------------------------------

  $con = mysql_connect($host,$user,$pass);
  $dbs = mysql_select_db($databaseName, $con);

  $tanggal=$_POST['datepicker'];
  $silo=$_POST['silo'];
  //--------------------------------------------------------------------------
  // 2) Query database for data
  //--------------------------------------------------------------------------
  $result = mysql_query("SELECT * FROM $tableName");          //query
  $array = mysql_fetch_row($result);                          //fetch result 

  if($array>0){
    while($row=mysql_fetch_array($result)){

    }   
 }else{
    echo "<li>Tidak ada artikel yang ditemukan <li>";
 }
  //--------------------------------------------------------------------------
  // 3) echo result as json 
  //--------------------------------------------------------------------------
  echo json_encode($array);

?>
<form name="table_s" id="table_s" class="table_s">
    <table id="table_s" class="table_s"cellspacing='0' class="js-serial" border="2">
        <thead>

      <tr>
                <th><center>No.</center></th>
                <th><center>S1</center></th>
                <th><center>S2</center></th>
                <th><center>S3</center></th>
                <th><center>S4</center></th>
                <th><center>S5</center></th>
                <th><center>S6</center></th>
                <th><center>S7</center></th>
                <th><center>S8</center></th>
                <th><center>S9</center></th>
                <th><center>S10</center></th>
                <th><center>S11</center></th>
                <th><center>S12</center></th>
                <th><center>Ambien</center></th>
                <th><center>Average</center></th>
                <th><center>Deff</center></th>
                <th><center>Status</center></th>
      </tr>

        </thead>
        <tbody>
          <tr>

          <tr>
            <td id="td_s0"></td>
            <td id="td_s1"></td>
            <td id="td_s2"></td>
            <td id="td_s3"></td>
            <td id="td_s4"></td>
            <td id="td_s5"></td>
            <td id="td_s6"></td>
            <td id="td_s7"></td>
            <td id="td_s8"></td>
            <td id="td_s9"></td>
            <td id="td_s10"></td>
            <td id="td_s11"></td>
            <td id="td_s12"></td>
            <td id="td_s13"></td>
            <td id="td_s14"></td>
            <td id="td_s15"></td>
            <td id="td_s16"></td>
          </tr>

      </tbody>
      </table>

【问题讨论】:

  • 您是使用 ajax 调用来调用 php 文件还是只想生成显示的 HTML??
  • 我想用 onclick 按钮将数据库值生成到我的表的 tbody 中,你知道如何生成吗?
  • 你也想生成标题吗??
  • 不只是值.. 我的 php 函数中的值

标签: php jquery json html-table display


【解决方案1】:

你可以像这样生成&lt;tbody&gt;的HTML。

 if($array>0){
    $tableHTML = "<tbody>";
    while($row=mysql_fetch_array($result)){
        $tableHTML .= "<tr>";
        $i=0;
        foreach ($row as $key=>$val) {
            $tableHTML .= "<td id='td_s".$i."'>".$row[$key]."</td>";
            $i++;
        }
        $tableHTML .= "</tr>";
    }   
    $tableHTML .= "<tbody>";
 }else{
    echo "<li>Tidak ada artikel yang ditemukan <li>";
 }

您会将列附加到每个&lt;td&gt; 以创建表。

完整代码

<form name="table_s" id="table_s" class="table_s">
<table id="table_s" class="table_s"cellspacing='0' class="js-serial" border="2">
    <thead>
  <tr>
            <th><center>No.</center></th>
            <th><center>S1</center></th>
            <th><center>S2</center></th>
            <th><center>S3</center></th>
            <th><center>S4</center></th>
            <th><center>S5</center></th>
            <th><center>S6</center></th>
            <th><center>S7</center></th>
            <th><center>S8</center></th>
            <th><center>S9</center></th>
            <th><center>S10</center></th>
            <th><center>S11</center></th>
            <th><center>S12</center></th>
            <th><center>Ambien</center></th>
            <th><center>Average</center></th>
            <th><center>Deff</center></th>
            <th><center>Status</center></th>
  </tr>

    </thead>
<?php
 $tableHTML = "";
 if($array>0){
    $tableHTML .= "<tbody>";
    while($row=mysql_fetch_array($result)){
        $tableHTML .= "<tr>";
        $i=0;
        foreach ($row as $key=>$val) {
            $tableHTML .= "<td id='td_s".$i."'>".$row[$key]."</td>";
            $i++;
        }
        $tableHTML .= "</tr>";
    }   
    $tableHTML .= "<tbody>";
 } else{
    echo "<li>Tidak ada artikel yang ditemukan <li>";
 }

 echo $tableHTML; //echo the HTML of tbody

 ?>
  </table>

Jquery 代码

$( document ).ready(function() {
    $('#ok').on('click', function(e) {

      $.ajax({                                      
      url: '../php/termo_sel.php',                           
      data: {datepicker: 'val1', silo : 'val2'}, //Pass data to PHP by POST
      type: 'post',                       
      dataType: 'json',                     
      success: function(data)    //Whatever is put in echo in PHP is returned here     
      {
        $('#table_s').append(data);
      }
      });

    });
});

只需使用此代码。希望对你有帮助。

【讨论】:

    【解决方案2】:
    <form name="table_s" id="table_s" class="table_s">
        <table id="table_s" class="table_s"cellspacing='0' class="js-serial" border="2">
            <thead>
          <tr>
                    <th><center>No.</center></th>
                    <th><center>S1</center></th>
                    <th><center>S2</center></th>
                    <th><center>S3</center></th>
                    <th><center>S4</center></th>
                    <th><center>S5</center></th>
                    <th><center>S6</center></th>
                    <th><center>S7</center></th>
                    <th><center>S8</center></th>
                    <th><center>S9</center></th>
                    <th><center>S10</center></th>
                    <th><center>S11</center></th>
                    <th><center>S12</center></th>
                    <th><center>Ambien</center></th>
                    <th><center>Average</center></th>
                    <th><center>Deff</center></th>
                    <th><center>Status</center></th>
          </tr>
    
            </thead>
            <tbody>
                <tr>
                    <?php do { ?>
              <tr>
                <td id="td_s0"><?php echo $row_Recordset1['no']; ?></td>
                <td id="td_s1"><?php echo $row_Recordset1['sensor1']; ?></td>
                <td id="td_s2"><?php echo $row_Recordset1['sensor2']; ?></td>
                <td id="td_s3"><?php echo $row_Recordset1['sensor3']; ?></td>
                <td id="td_s4"><?php echo $row_Recordset1['sensor4']; ?></td>
                <td id="td_s5"><?php echo $row_Recordset1['sensor5']; ?></td>
                <td id="td_s6"><?php echo $row_Recordset1['sensor6']; ?></td>
                <td id="td_s7"><?php echo $row_Recordset1['sensor7']; ?></td>
                <td id="td_s8"><?php echo $row_Recordset1['sensor8']; ?></td>
                <td id="td_s9"><?php echo $row_Recordset1['sensor9']; ?></td>
                <td id="td_s10"><?php echo $row_Recordset1['sensor10']; ?></td>
                <td id="td_s11"><?php echo $row_Recordset1['sensor11']; ?></td>
                <td id="td_s12"><?php echo $row_Recordset1['sensor12']; ?></td>
                <td id="td_s13"><?php echo $row_Recordset1['ambien']; ?></td>
                <td id="td_s14"><?php echo $row_Recordset1['average']; ?></td>
                <td id="td_s15"><?php echo $row_Recordset1['deffiasi']; ?></td>
                <td id="td_s16"><?php echo $row_Recordset1['status']; ?></td>
              </tr>
              <?php } while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)); ?>
                </tr>
          </tbody>
          </table>
    

    这就是我的意思.. 我的表的 tbody 有一个记录值。 我可以将您编辑的脚本的回声再次放入其中还是可以将回声放入 jquery 中?

    【讨论】:

      【解决方案3】:

      您的数组不需要json_encode,您可以通过 $array['column name'] 访问数组中的每一列。例如,如果您有一个包含用户名和密码的用户表,并且您需要获取它们,您可以使用 $array['username']$array['password']

      查看您的代码,您似乎想在此处一一显示:

      while($row=mysql_fetch_array($result)){
          echo "<tr> $row['column name'] </tr>";
      }
      

      【讨论】:

      • 是的,就像那样.. 我想一一调用它们,但对于列的所有记录.. 但我想调用我在 html 中创建的 tbody 上的值(需要点击函数不是直接函数)。
      • 我只是想从那个 php 函数中调用值,可以填写在我的 html tbody 表中。可以帮我怎么做吗?
      【解决方案4】:

      查询代码

      $(document).on('click','#ok',function(e) {
      
          $.ajax({                                      
            url: '../php/termo_sel.php',                           
            data: "",                        
            dataType: 'json',                     
            success: function(data)         
            {
              var id = data[0];             
              var tanggal = data[1];
              var silo = data[2];
              var sensor1 = data[3];
              var sensor2 = data[4];
              var sensor3 = data[5];
              var sensor4 = data[6];
              var sensor5 = data[7];
              var sensor6 = data[8];
              var sensor7 = data[9];
              var sensor8 = data[10];
              var sensor9 = data[11];
              var sensor10= data[12];
              var ambien= data[13];
              var average= data[14];
              var deffiasi= data[15];
              var status= data[16];
      
              $('#data_area').html("<b></b>"+id+"<b></b>"+tanggal); //Set output element html
              //recommend reading up on jquery selectors they are awesome 
              // http://api.jquery.com/category/selectors/
            }
          });
      
          clearInput();
      
      });
      
      function clearInput() {
          $("#form_input :input").each( function() {
             $('#s1').val('');
             $('#s2').val('');
             $('#s3').val('');
             $('#s4').val('');
             $('#s5').val('');
             $('#s6').val('');
             $('#s7').val('');
             $('#s8').val('');
             $('#s9').val('');
             $('#s10').val('');
             $('#s11').val('');
             $('#s12').val('');
             $('#amb').val('35.0');
             $('#avr').val('');
             $('#deff').val('');
             $('#sts').val('');
          });
      
      
      }
      

      HTML 代码

      <div id="kanan"  class="btn btn-default" style="padding-left:20px" >
          <form name="table_s" id="table_s" class="table_s">
          <table id="table_s" class="table_s"cellspacing='0' class="js-serial" border="2">
              <thead>
      
            <tr>
                      <th><center>No.</center></th>
                      <th><center>S1</center></th>
                      <th><center>S2</center></th>
                      <th><center>S3</center></th>
                      <th><center>S4</center></th>
                      <th><center>S5</center></th>
                      <th><center>S6</center></th>
                      <th><center>S7</center></th>
                      <th><center>S8</center></th>
                      <th><center>S9</center></th>
                      <th><center>S10</center></th>
                      <th><center>S11</center></th>
                      <th><center>S12</center></th>
                      <th><center>Ambien</center></th>
                      <th><center>Average</center></th>
                      <th><center>Deff</center></th>
                      <th><center>Status</center></th>
            </tr>
      
              </thead>
              <tbody>
                  <tr>
                      <?php do { ?>
                <tr>
                  <td id="td_s0"><?php echo $row_Recordset1['no']; ?></td>
                  <td id="td_s1"><?php echo $row_Recordset1['sensor1']; ?></td>
                  <td id="td_s2"><?php echo $row_Recordset1['sensor2']; ?></td>
                  <td id="td_s3"><?php echo $row_Recordset1['sensor3']; ?></td>
                  <td id="td_s4"><?php echo $row_Recordset1['sensor4']; ?></td>
                  <td id="td_s5"><?php echo $row_Recordset1['sensor5']; ?></td>
                  <td id="td_s6"><?php echo $row_Recordset1['sensor6']; ?></td>
                  <td id="td_s7"><?php echo $row_Recordset1['sensor7']; ?></td>
                  <td id="td_s8"><?php echo $row_Recordset1['sensor8']; ?></td>
                  <td id="td_s9"><?php echo $row_Recordset1['sensor9']; ?></td>
                  <td id="td_s10"><?php echo $row_Recordset1['sensor10']; ?></td>
                  <td id="td_s11"><?php echo $row_Recordset1['sensor11']; ?></td>
                  <td id="td_s12"><?php echo $row_Recordset1['sensor12']; ?></td>
                  <td id="td_s13"><?php echo $row_Recordset1['ambien']; ?></td>
                  <td id="td_s14"><?php echo $row_Recordset1['average']; ?></td>
                  <td id="td_s15"><?php echo $row_Recordset1['deffiasi']; ?></td>
                  <td id="td_s16"><?php echo $row_Recordset1['status']; ?></td>
                </tr>
                <?php } while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)); ?>
                  </tr>
            </tbody>
            </table>
      

      PHP 代码

        //--------------------------------------------------------------------------
        // Example php script for fetching data from mysql database
        //--------------------------------------------------------------------------
        $host = "localhost";
        $user = "root";
        $pass = "";
      
        $databaseName = "silo";
        $tableName = "temp1";
      
        //--------------------------------------------------------------------------
        // 1) Connect to mysql database
        //--------------------------------------------------------------------------
      
        $con = mysql_connect($host,$user,$pass);
        $dbs = mysql_select_db($databaseName, $con);
      
        $tanggal=$_POST['datepicker'];
        $silo=$_POST['silo'];
        //--------------------------------------------------------------------------
        // 2) Query database for data
        //--------------------------------------------------------------------------
        $result = mysql_query("SELECT * FROM $tableName");          //query
        $array = mysql_fetch_row($result);                          //fetch result 
      
        if($array>0){
          while($row=mysql_fetch_array($result)){
      
          }   
       }else{
          echo "<li>Tidak ada artikel yang ditemukan <li>";
       }
        //--------------------------------------------------------------------------
        // 3) echo result as json 
        //--------------------------------------------------------------------------
        echo json_encode($array);
      
      ?>
      

      其中三个分开在 3 个文件中。 .php、.html、.js

      【讨论】:

        猜你喜欢
        • 2017-07-28
        • 1970-01-01
        • 1970-01-01
        • 2018-08-21
        • 1970-01-01
        • 2019-08-31
        • 2020-11-29
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多