MysqlのデータをHTML, PHPで表示する

最近フリマアプリを使用して物を売ることが多くなってきたので、
Mysqlを使って在庫管理をしてみようと思いました。
（普段は中国語を使っていて文章をピンインでベタ打ちするのが習慣になってしまっていて、見にくくてすみません。）

以下の画像中の上側のテーブルのテキストエリアに入れたデータが、Denglu（登録）ボタンを押すと、Mysqlに追加されて、下側に表で表示するものを作成してみました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3120035/83de5690-393f-04ad-5602-f3456e893f90.png)
Mysqlのカラムは、
```
ID: ID
CSSJ: 出售时间（出品日）
SPM: 商品名（商品名）
KC: 库存量（在庫量）
DG: 定价（定価）
CSJ: 出售价（売値）
FSFS: 发送方式（発送方式）
BZFS: 包装方式（包装）
BZF: 包装费（包装費）
YF: 运费（送料）
SXF: 手续费（手数料）
HJ: 合计（合計）
QK: 情况（状況）
XDSJ: 下单时间（売れた日）
YL: 盈利（利益）
```
としています。
手数料は売値の10%が自動入力される仕様にしました。
Mysqlに接続成功したら、”Database lianjie: OK”と表示されます。
また、登録ボタンの下は削除欄で、IDを入力して”Shanchu”を押すとそのIDのデータが削除されます。

```
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
<title>KUCUNGUANLI</title>
</head>
<body>
  <div class = "faq" id = "display" style = "background-color:#961c6b;">
  <form method="post">
<table class="input form" border="3">
    <a>KUCUNGUANLI</a>
    <?php

const DB_HOST = '';//HOST名
const DB_NAME = '';//DATABASE名
const DB_USER = '';//USER名
const DB_PASSWORD = '';//密码

$host = DB_HOST;
$db = DB_NAME;
$user = DB_USER;
$pass = DB_PASSWORD;

$dsn = "mysql:host=$host;dbname=$db;charset=utf8mb4";

try{
  $pdo = new PDO($dsn, $user, $pass, [
    PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION, 
    PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC 
    ]);
    echo '<p>データベースとの接続: 正常</p>';
}catch(PDOException $e){
    echo '<p>データベースとの接続: 不可</p>'. $e -> getMessage();
    exit();
}
?>
<tr>
      <th>ID</th>
      <th>CSSJ</th>
      <th>SPM</th>
      <th>KC</th>
      <th>DG</th>
      <th>CSJ</th>
      <th>FSFS</th>
      <th>BZFS</th>
      <th>BZF</th>
      <th>YF</th>
      <th>SXF</th>
      <th>HJ</th>
      <th>QK</th>
      <th>XDSJ</th>
      <th>YL</th>
</tr>
<tr>
      <td><?php
      session_start();
      $idno = $_SESSION['idno'];
      echo $idno;
      ?></td>
      <td><?php
      echo date("Y/m/d");
      ?></td>
      <td><input type="text" size="7" name="s2" id="s2" /></td>
      <td><input type="text" size="7" name="s3" id="s3" /></td>
      <td><input type="text" size="7" name="s4" id="s4" /></td>
      <td><input type="text" size="7" name="s5" id="s5" /></td>
      <td><input type="text" size="7" name="s6" id="s6" /></td>
      <td><input type="text" size="7" name="s7" id="s7" /></td>
      <td><input type="text" size="7" name="s8" id="s8" /></td>
      <td><input type="text" size="7" name="s9" id="s9" /></td>
      <td><input type="text" size="7" name="s10" id="s10" /></td>
      <td><input type="text" size="7" name="s11" id="s11" /></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
    <tr>
    <!--<td><input type="button" id="gengxin" value="gengxin"></td>-->
    <!--<td><input type="button" id="zhuijia" value="zhuijia"></td>-->
    <td><input type="submit" name="but" value="Denglu"/></td>
</tr>
</table>    
<table class="delete form" border="3">
<tr>
<td><input type="text" size="7" name="dels" id="dels" /></td>
<td><input type="submit" name="sch" value="Shanchu"/></td>
</tr>
</table>

<?php
   // shiyong SESSION
   $_SESSION['idno'];
   $host1 = '';//データベースのHOST名
   $username1 = '';//データベースのUSER名
   $passwd1 = '';//データベースのパスワード
   $dbname1 = '';//データベース名

   $link = mysqli_connect('127.0.0.1', 'mkjuesa', 'password1');//localhostで接続,データベースUSER名がmkjuesa, パスワードがpassword1のとき
   if (!$link) {
    print('<p>接続失敗</p>'.mysqli_error());
   } else {
    //print('<p>接続成功</p>');
   }

   $result = mysqli_select_db($link, $dbname1);
   if (!$result) {
    print('<p>データベースの選択失敗</p>');
   } else {
    //print('<p>データベースの選択成功</p>');
   }

   $result = mysqli_query($link, 'SET NAMES utf8');
   if (!$result) {
    print('<p>文字コードの設定失敗</p>');
   } else {
    //print('<p>文字コードの設定成功</p>');
   }

   $dsn = "mysql:host=$host1;dbname=$dbname1;charset=utf8mb4";

   $pdo = new PDO($dsn, $username1, $passwd1, [
    PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION, 
    PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC 
    ]);

    if(isset($_POST['but'])){
    // SQL文
    $stmt = $pdo->prepare('INSERT INTO kucun (ID, CSSJ, SPM, KC, DG, CSJ, FSFS, BZFS, BZF, YF, SXF, HJ, QK, XDSJ, YL) VALUES(:id, :cssj, :spm, :kc, :dg, :csj, :fsfs, :bzfs, :bzf, :yf, :sxf, :hj, :qk, :xdsj, :yl)');
    
    $idno = $_SESSION['idno'];
    $ss1 = (string)$idno;
    $ss2 = filter_input(INPUT_POST, 's2');
    $ss3 = filter_input(INPUT_POST, 's3');
    $ss4 = filter_input(INPUT_POST, 's4');
    $ss5 = filter_input(INPUT_POST, 's5');
    $ss6 = filter_input(INPUT_POST, 's6');
    $ss7 = filter_input(INPUT_POST, 's7');
    $ss8 = filter_input(INPUT_POST, 's8');
    $ss9 = filter_input(INPUT_POST, 's9');
    $ss10 = filter_input(INPUT_POST, 's10');
    $ss11 = filter_input(INPUT_POST, 's11');
    //$ss12 = filter_input(INPUT_POST, 's12');
    //$ss13 = filter_input(INPUT_POST, 's13');
    //$ss14 = filter_input(INPUT_POST, 's14');

    // 赋值
    $stmt->bindValue(':id', $ss1);//ID
    $stmt->bindValue(':cssj', $ss2);//出售时间
    $stmt->bindValue(':spm', $ss3);//商品名
    $stmt->bindValue(':kc', $ss4);//库存量
    $stmt->bindValue(':dg', $ss5);//定价
    $stmt->bindValue(':csj', $ss6);//出售价
    $stmt->bindValue(':fsfs', $ss7);//发送方式
    $stmt->bindValue(':bzfs', $ss8);//包装方式
    $stmt->bindValue(':bzf', $ss9);//包装费
    $stmt->bindValue(':yf', $ss10);//运费
    $stmt->bindValue(':sxf', $ss11);//手续费
    $stmt->bindValue(':hj', $ss6 + $ss9 + $ss10 + $ss11);//合计
    $stmt->bindValue(':qk', "");//情况
    $stmt->bindValue(':xdsj', "");//下单时间
    $stmt->bindValue(':yl', $ss6 + $ss10 + $ss11);//盈利
 
    // SQL实行
    $stmt->execute();
    $_SESSION['idno'] = $idno + 1;
    }

    if(isset($_POST['sch'])){
    $scn = filter_input(INPUT_POST, 'dels');
    echo "Zuihoushanchu: $scn";
    $stmt = $pdo->prepare("DELETE FROM kucun WHERE ID = $scn");
    $stmt->execute();
    }

    $sql = "SELECT * FROM kucun";
    $res = mysqli_query($link, $sql);
    echo "<table border='1'>";
    echo "    <tr>";
    echo "<th>ID</th>";
    echo "<th>CSSJ</th>";
    echo "<th>SPM</th>";
    echo "<th>KC</th>";
    echo "<th>DG</th>";
    echo "<th>CSJ</th>";
    echo "<th>FSFS</th>";
    echo "<th>BZFS</th>";
    echo "<th>BZF</th>";
    echo "<th>YF</th>";
    echo "<th>SXF</th>";
    echo "<th>HJ</th>";
    echo "<th>QK</th>";
    echo "<th>XDSJ</th>";
    echo "<th>YL</th>";
    echo "    </tr>";
 
    while($row = mysqli_fetch_assoc($res)) {
        echo "<tr>";
        echo "  <td>{$row['ID']}</td>";      
        echo "  <td>{$row['CSSJ']}</td>";
        echo "  <td>{$row['SPM']}</td>";
        echo "  <td>{$row['KC']}</td>";
        echo "  <td>{$row['DG']}</td>";
        echo "  <td>{$row['CSJ']}</td>";
        echo "  <td>{$row['FSFS']}</td>";
        echo "  <td>{$row['BZFS']}</td>";
        echo "  <td>{$row['BZF']}</td>";
        echo "  <td>{$row['YF']}</td>";
        echo "  <td>{$row['SXF']}</td>";
        echo "  <td>{$row['HJ']}</td>";
        echo "  <td><input type='text' size='7' /></td>";
        echo "  <td><input type='text' size='7' /></td>";
        echo "  <td>{$row['YL']}</td>";
        echo "</tr>";
    }

   $con = mysqli_close($link);
   if (!$con) {
    print('<p>データベースとの通信切断失敗</p>');
  } else {
   //print('<p>データベースとの通信切断成功</p>');
   print('<p>状態: 正常</p>');
  }
   
?>

  </form>
</div>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous"></script>
<script type="text/javascript">
'use strict';

const aaa = 0;
var dateObj = new Date();
var text = '';
var shangpinming = '';
var kucun = 1;

text = dateObj.getFullYear() + '/' + 
       (dateObj.getMonth() + 1) + '/' + 
       dateObj.getDate() 
       
$(document).ready(function() {
    $("#s6").focusout(function() {
      var inputNumber = $("#s6").val(); 
      var resultDivision = inputNumber * -0.1;
      var ssss = Math.floor(resultDivision);
      $("#s11").val(ssss); 
    })
});

</script>
</body>
</html>
```

以上ご参考になれば幸甚です。