溫瑞烘老師的教學歷程檔案(Teaching ePortfolio) - 105-1-資料庫程式設計 - 第一次補強
 

資訊管理系
副教授
温瑞烘


歷程檔案 Portfolio


關於我 About Me

第一次補強

第一次補強 目的:以網站來展現本學期的作業
網站架構
      三欄式 Frame, C:/AppServ/www/index.html  為網站入口、 頂端 top.html、 
      左側選單 left.html 、中間顯示區 middle.html
      
建立C:/AppServ/www/db1放置所有文件,包括 db1.sql config.php style.css db1_1.php
//db1.sql
DROP DATABASE IF EXISTS db1; 
CREATE DATABASE db1 DEFAULT CHARACTER SET utf8; 
USE db1;  
CREATE TABLE stmd (
  student_no     CHAR(9)     COMMENT  '學號',
  primary key(student_no)
);
 
//config.php
<?php
  $host = "127.0.0.1";
  $user = "root";
  $pwd = "0000";
  $dbname="db1";
  $conn=mysqli_connect($host,$user,$pwd) or die("無法連接主機");
  mysqli_query($conn,'SET NAMES utf8'); 
  mysqli_select_db($conn,$dbname) or die("無法連接資料庫");
?>
 
//style.css
<style type='text/css'>
   body { width:100%; margin:0 padding:0; font-family:標楷體; }
   table { border-collapse:collapse; border:1px solid black;
           empty-cells:show; width:100%; }
   th { background-color:ccffff; border: 1px solid; font-family:標楷體;}
   td { border: 1px solid; text-align : center; font-family:標楷體; }
   .alt0 { background-color:#99ffff; font-weight:bold; font-family:標楷體; }
   .alt1 { background-color:#ccccff; font-family:標楷體; }
   .alt2 { background-color:#ccffff; font-family:標楷體; }
   .alt3 { background-color:#fff8c6; font-family:標楷體; }
   a: { background:ccccff; border:1px solid ccc; color:000;
       padding:.3em .5em;  margin-top:1px;  margin-bottom:1px; text-align:center;
       text-decoration:none; display: inline-block; font-family:標楷體; }
   a:link {background-color:ff88ee } 
   a:visited {background-color:FFFF85;}
   a:hover {background-color:FF704D; }  
   a:active {background-color:FF704D; } 
   p {background-color: #81F781; display:inline;font-family:標楷體; font-weight:bold;}  
   .cmd  {font-family:標楷體; font-size:18px; background-color:ccccff; width:4em; } 
   .cmd1 {font-family:標楷體; font-size:18px; background-color:ccccff; width:10em; } 
   .cmd2 {font-family:標楷體; font-size:18px; background-color:ccccff; width:5em; } 
 </style>
 
//db1_1.php
<?php
 
  include "config.php"; // 連線組態
  if (isset($_POST["command"])) $command=$_POST["command"];
  else $command="";
  if ($command=="" || $con=mmand=="返回") {
    display_first_page($conn);
  }
  elseif ($command=="新增") {
    display_insert_page($conn);
    display_first_page($conn);
  }
  elseif ($command=="查詢") {
    display_search_page($conn);
  }
 elseif ($command=="刪除") {
    display_delete_page($conn);
    display_first_page($conn);
  }
  mysqli_close($conn);
 
  function display_first_page($conn) { // 第一個頁面
    echo "<html><head><title>MySql與PHP結合-TEXT-新增-查詢-範例</title>
          <link rel='stylesheet' type='text/css' href='style.css'>
          </head><body><center>
          <table> <form method='post' action=''>
          <tr class='alt0'><td colspan=2>MySql與PHP結合-TEXT-新增-查詢-範例</td></tr>
          <tr><td class='alt1'>學號</td>
          <td><input type='text' name='student_no' /></td></tr></table>
          <input class='cmd' type='submit' name='command' value='查詢'>
          <input class='cmd' type='submit' name='command' value='新增'>
          </form></center></body></html>";
  }
 
  function display_search_page($conn) {
    $student_no=trim($_POST["student_no"]); // 取得輸入的學號,移除前後空白
    if ($student_no=="") $student_no="%";   // 查詢全部
    else $student_no="%".$student_no."%";   // 查詢匹配的學號
    $sql="select * from stmd where student_no like '$student_no' order by student_no";
    $result=mysqli_query($conn,$sql);
    echo "<html><head>
              <link rel='stylesheet' type='text/css' href='style.css'>
              </head><body><center>
              <table><form method='post' action=''>
              <tr class='alt0'><td colspan=2>MySql與PHP結合-新增-查詢-刪除-範例</td></tr>
              <tr class='alt1'><td>學號</td><td>選擇</td></tr>";
    $cnt=0;
    while ($myrow=mysqli_fetch_array($result)) { 
      $student_no=$myrow["student_no"];    
      $bgcolor=$cnt % 2+ 2;
      echo "<tr class='alt$bgcolor'><td>$student_no</td>
                <td><input type='radio' name='student_no' value='$student_no'></td></tr>";
      $cnt++;
    }
    echo "</table>
               <input class='cmd' type='submit' name='command' value='刪除'
                   onclick=\"return confirm('確定要刪除嗎');\" >
               <input class='cmd' type='submit' name='command' value='返回'>
               </center></form></body></html>"; 
  }
 
  function display_insert_page($conn) {
    $student_no=$_POST["student_no"];
    if ($student_no=="") {
      display_first_page($conn); exit();
    }
    $sql="insert into stmd values('$student_no')";
    mysqli_query($conn,$sql);                    
  }
 
  function display_delete_page($conn) {
    $student_no=$_POST["student_no"];
    if ($student_no=="") {
      display_first_page($conn); exit();
    }
    $sql="delete from stmd where student_no='$student_no'";
    mysqli_query($conn,$sql);                    
  }
 
?> 
 
// index.html
<FRAMESET rows='20%,*' bordercolor='#ff00ff'>
       <FRAME name='top' SRC='top.html' >
        <FRAMESET cols='20%,80%' bordercolor='#ff00ff'>
             <FRAME name='left' SRC='left.html'>
             <FRAME name='middle' SRC='middle.html'>
         </FRAMESET>
  </FRAMESET>
 
//top.html
<h1>班級     學號     姓名 </h1>
 
//middle.html
<h1>班級     學號     姓名 </h1>
 
//left.html
<a href='/db1/db1_1.php' target='middle'>第一次補強作業</a>
 
// 執行 
http://localhost/index.html
 
 
完成後以FileZilla上傳至ccs.cust.edu.tw/www/db1之下或雲端硬碟
 
關機、重開機
 
下載index.html top.html left.html middle.html至 C:/AppServ/www
 
下載 db1資料夾至C:/Appserv/www
 
複製db1 資料夾 貼上 更名 db2 以下列結構撰寫 db2_1.php 並更改 left.html
 
//db2.sql
DROP DATABASE IF EXISTS db2; 
CREATE DATABASE db1 DEFAULT CHARACTER SET utf8; 
USE db2;  
CREATE TABLE stmd (
  student_no       CHAR(9)           COMMENT  '學號',
  student_name   VARCHAR(20) COMMENT  '姓名',
  primary key(student_no)
);
 
 複製 db2 資料夾 貼上 更名 db3 以下列結構撰寫 db3_1.php 並更改 left.html

//db3.sql
DROP DATABASE IF EXISTS db3
CREATE DATABSE db3 DEFAULT CHARACTER SET utf8;
USE db3;
CREATE TABLE stmd (
   student_no       CHAR(9)   comment '學號',
   student_name  VARCHAR(20)  comment '姓名',
   address            VARCHAR(100) comment '地址',
   PRIMARY KEY(student_no)
);

 
全部共 0則留言
登入帳號密碼代表遵守學術網路規範
 


文章分類 Labels

 


最新文章 Top10

中華科技大學數位化學習歷程 - 意見反應