php-db-question/index.html

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>PHP-DB連携(PDO)問題 スタートページ</title>
    <link href="common/css/bootstrap.min.css" rel="stylesheet">
</head>

<body>
    <div class="container">
        <div class="page-header">
            <h1>PHP-DB連携(PDO)問題 <small>MySQL実践課題</small></h1>
        </div>
        <div class="panel-group" id="accordion">
            <!-- Ex01: 基本的なDB接続 -->
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a href="Ex01.php" target="_blank">
                            <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
                            Ex01: 基本的なDB接続
                        </a>
                        <small>初級</small>
                    </h4>
                </div>
            </div>

            <!-- Ex02: SELECTクエリの実行 -->
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a href="Ex02.php" target="_blank">
                            <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
                            Ex02: SELECTクエリ実行結果の表示
                        </a>
                        <small>初級</small>
                    </h4>
                </div>
            </div>

            <!-- Ex03: INSERTクエリの実行 -->
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a href="Ex03.php" target="_blank">
                            <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
                            Ex03: INSERTクエリの実行
                        </a>
                        <small>初級</small>
                    </h4>
                </div>
            </div>

            <!-- Ex04: UPDATEクエリの実行 -->
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a data-toggle="collapse" data-parent="#accordion" href="#collapseEx04">
                            <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
                            Ex04: UPDATEクエリの実行
                        </a>
                        <small>初級</small>
                    </h4>
                </div>
                <div id="collapseEx04" class="panel-collapse collapse">
                    <div class="panel-body">
                        <!-- POSTフォーム for Ex04.php -->
                        <form method="post" action="Ex04.php" target="_blank" class="form-inline">
                            <div class="form-group">
                                <label for="id">従業員ID:</label>
                                <input type="number" class="form-control" name="id" id="id" value="1">
                            </div>
                            <div class="form-group">
                                <label for="salary">給与:</label>
                                <input type="number" class="form-control" name="salary" id="salary" value="1000"
                                    step="0.01">
                            </div>
                            <button type="submit" class="btn btn-primary">実行</button>
                        </form>
                    </div>
                </div>
            </div>

            <!-- Ex05: JOINによるSELECTクエリ -->
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a href="Ex05.php" target="_blank">
                            <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
                            Ex05: JOINによるSELECTクエリの実行
                        </a>
                        <small>中級</small>
                    </h4>
                </div>
            </div>

            <!-- Ex06: 画像登録（アップロード） -->
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a data-toggle="collapse" data-parent="#accordion" href="#collapseEx07Upload">
                            <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
                            Ex06: 画像登録（アップロード）
                        </a>
                        <small>上級</small>
                    </h4>
                </div>
                <div id="collapseEx07Upload" class="panel-collapse collapse">
                    <div class="panel-body">
                        <!-- POSTフォーム for Ex07_query.php -->
                        <form method="post" action="Ex06_image_regist.php" target="_blank" enctype="multipart/form-data"
                            class="form-inline">
                            <div class="form-group">
                                <label for="image">画像ファイル:</label>
                                <input type="file" class="form-control" name="image" id="image">
                            </div>
                            <button type="submit" class="btn btn-primary">アップロード</button>
                        </form>
                    </div>
                </div>
            </div>
            <!-- Ex06 Part2: 画像表示（GETで画像ID指定） -->
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a data-toggle="collapse" data-parent="#accordion" href="#collapseEx07Display">
                            <span class="glyphicon glyphicon-picture" aria-hidden="true"></span>
                            Ex06: 画像表示（画像ID指定）
                        </a>
                        <small>上級</small>
                    </h4>
                </div>
                <div id="collapseEx07Display" class="panel-collapse collapse">
                    <div class="panel-body">
                        <!-- GETフォーム for Ex07.php -->
                        <form method="get" action="Ex06_image_display.php" target="_blank" class="form-inline">
                            <div class="form-group">
                                <label for="id">画像ID:</label>
                                <input type="number" class="form-control" name="id" id="id" value="1">
                            </div>
                            <button type="submit" class="btn btn-primary">画像表示</button>
                        </form>
                    </div>
                </div>
            </div>

        </div>
    </div>

    <!-- jQuery -->
    <script src="common/js/jquery-3.2.1.min.js"></script>
    <!-- Bootstrap Core JavaScript -->
    <script src="common/js/bootstrap.min"></script>
</body>

</html>