PHP データベースを利用したWebアプリケーションの開発【第三回】データの一覧表示 select
2020年9月27日
【第二回】でデータベースに会員情報を登録しました。
今回は、登録したデータを一覧表示し、編集用の画面へのリンクと削除用のボタンを作成します。
この記事の著者 ->S.E; です。
普段は、システム開発に必要なヒアリング、システムの要件定義、設計からプログラマとしてWebサイトやWebアプリケーションの開発、WordPressでのブログの執筆やサーバー運用・管理を行っています。
このページは「未経験の為のプログラミング講座 ゼロから始めるPHPプログラミング〜初級から実践編までを網羅〜」としてPHPの基本的な部分を【初級編】【中級編】【上級編】に分けて解説しています。最終的には簡単なフォームやシステム開発をフルスクラッチで行うことを目的としています。また、参考になる書籍なども紹介しています。
会員情報一覧ページをHTMLでコーディングする
一覧ページに掲載する内容は下記の内容で作成します。
- 詳細（編集）ページへのボタン
- 名前
- 年齢
- 削除ボタン
上記以外の項目は「詳細（編集）ページへのボタン」から確認できる仕様を想定しています。
会員情報一覧用list.phpのコーディング
まず、list.php ファイルを作成します。
表示する会員情報はtableで表示します、まだプログラムを埋め込んでいないので<tr><td>〜</td></tr>内はダミーの情報を入れています。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 | <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>会員情報一覧</title> </head> <body> <header> <h1>会員情報一覧</h1> </header> <section> <table> <tr> <th>詳細</th> <th>会員名</th> <th>年齢</th> <th>登録日</th> <th>更新日</th> <th>削除</th> </tr> <tr> <td><a href="edit.php">詳細・編集</a></td> <td>山田 太郎</td> <td>25歳</td> <td>2020-09-27 00:00:00</td> <td>2020-09-27 00:00:00</td> <td><a href="list.php">削除</a></td> </tr> <tr> <td><a href="edit.php">詳細・編集</a></td> <td>山田 太郎</td> <td>25歳</td> <td>2020-09-27 00:00:00</td> <td>2020-09-27 00:00:00</td> <td><a href="list.php">削除</a></td> </tr> </table> </section> </body> </html> |
これでHTMLのコーディングは完了です。
会員情報一覧取得用のスクリプトをclass.Member.phpへ追記
前回、会員情報を登録するためのクラス「class.Member.php」を作成しました。今回の一覧情報取得用のスクリプトもこの「class.Member.php」にまとめて記述します。
前回までの「class.Member.php」のソースは下記になります。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 | <?php // class.DBをインクルード include 'class.DB.php'; // DBクラスを継承しMemberクラスを作成 class Member extends DB{ const ERROR_STR01 = '入力してください'; const ERROR_STR02 = '選択してください'; private $_test_name; private $_test_age; private $_test_gender; private $_test_tel; private $_test_tel01; private $_test_tel02; private $_test_tel03; public $_test_gender_arr = array( 1 => '男性', 2 => '女性' ); // セッターとゲッター public function setTestName( $val ){ $this->_test_name = $val; } public function getTestName(){ return $this->_test_name; } public function setTestAge( $val ){ $this->_test_age = $val; } public function getTestAge(){ return $this->_test_age; } public function setTestGender( $val ){ $this->_test_gender = $val; } public function getTestGender(){ return $this->_test_gender; } public function setTestTel( $val01, $val02, $val03){ if($val01 && $val02 && $val03) $this->_test_tel = $val01.'-'.$val02.'-'.$val03; else $this->_test_tel = ''; $this->_test_tel01 = $val01; $this->_test_tel02 = $val02; $this->_test_tel03 = $val03; } public function getTestTel(){ return $this->_test_tel; } public function getTestTel01(){ return $this->_test_tel01; } public function getTestTel02(){ return $this->_test_tel02; } public function getTestTel03(){ return $this->_test_tel03; } // 入力エラーチェック public function checkError(){ $error = array(); $error['error'] = false; $error['test_name'] = false; if( !self::getTestName() ) $error['error'] = $error['test_name'] = true; $error['test_age'] = false; if( self::getTestAge() == '' ) $error['error'] = $error['test_age'] = true; $error['test_gender'] = false; if( !self::getTestGender() ) $error['error'] = $error['test_gender'] = true; $error['test_tel'] = false; if( !self::getTestTel() ) $error['error'] = $error['test_tel'] = true; return $error; } public function insertDB(){ try{ $PDO = parent::ConnectDB(); $query = "INSERT INTO test_table ( "; $query .= " test_name "; $query2 = " :test_name "; $query .= ",test_age "; $query2 .= ",:test_age "; $query .= ",test_gender "; $query2 .= ",:test_gender "; $query .= ",test_tel "; $query2 .= ",:test_tel "; $query .= ",test_create "; $query2 .= ",now() "; $query .= ")VALUES( "; $query .= $query2; $query .= ") "; $stmt = $PDO->prepare($query); $stmt->bindValue(':test_name', self::getTestName(), PDO::PARAM_STR); $stmt->bindValue(':test_age', self::getTestAge(), PDO::PARAM_INT); $stmt->bindValue(':test_gender', self::getTestGender(), PDO::PARAM_INT); $stmt->bindValue(':test_tel', self::getTestTel(), PDO::PARAM_STR); $stmt->execute(); return true; } catch( Exception $e ){ echo $e->getMessage(); exit(); } } } ?> |
では「class.Member.php」にデータ取得用のスクリプトを追記します。
データの取得にSELECT文を利用します。
SELECT文の注意点としては、削除された会員情報は取得しないように「WHERE句」を利用し「test_delete_key != 1」と記述することです。
また、データ取得後に取得したデータの総数を「rowCount()」を利用して取得しています。
データ登録時にエスケープされた文字列を元に戻すためのメソッド「StripcslashesArray」も記述しました。
エスケープされた文字列の例として「I’m」が「I\’m」と登録されているので、元の状態の「I’m」に戻すためのメソッドとなります。
また、「HtmlspecialcharsArray」は取得した情報をHTMLエンティティにエンコードするためのメソッドです。取得した情報を一個づつ「htmlspecialchars()」でエンコードしてもいいのですが、コードを簡略化するため、引数に配列を渡すとHTMLエンティティし返してくれるメソッド「HtmlspecialcharsArray」を作成しました。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 | <?php // class.DBをインクルード include 'class.DB.php'; // DBクラスを継承しMemberクラスを作成 class Member extends DB{ 〜省略〜 public function getData(){ try{ $PDO = parent::ConnectDB(); $query = "SELECT "; $query .= " test_id "; $query .= ",test_name "; $query .= ",test_age "; $query .= ",test_gender "; $query .= ",test_tel "; $query .= ",test_create "; $query .= ",test_update "; $query .= "FROM "; $query .= "test_table "; $query .= "WHERE "; $query .= "test_delete_key != 1 "; $stmt = $PDO->prepare($query); $stmt->execute(); while( $row = $stmt->fetch(PDO::FETCH_ASSOC) ) { $row = self::stripSlashesArray($row); $tmp = self::htmlSpecialCharsArray($row); $data['test_id'][] = $tmp['test_id']; $data['test_name'][] = $tmp['test_name']; $data['test_age'][] = $tmp['test_age']; $data['test_gender'][] = $tmp['test_gender']; $data['test_tel'][] = $tmp['test_tel']; $data['test_create'][] = $tmp['test_create']; $data['test_update'][] = $tmp['test_update']; } $data['rows'] = $stmt->rowCount(); return $data; } catch( Exception $e ){ echo $e->getMessage(); exit(); } } // addcslashes() でクォートされた文字列をアンクォートする //************************************** public function stripSlashesArray( $arr ){ $ret = $arr; if( is_array( $arr ) ) { foreach( $arr as $key => $value ) { if( $key != '' && $value != '' ) $ret[$key] = stripcslashes( $value ); } } return $ret; } // 特殊文字をHTMLエンティティに変換する //************************************** public function htmlSpecialCharsArray( $arr ){ $ret = $arr; if( is_array( $arr ) ) { foreach( $arr as $key => $value ) { if( $key != '' && $value != '' ) $ret[$key] = htmlspecialchars( $value ); } } return $ret; } } ?> |
これで一覧取得用のスクリプトが完成です。
次は、list.phpにプログラムを埋め込んでいきます。
HTML（list.php）にスクリプトを埋め込む
list.phpに今回追記したgetData()を埋め込み、一覧情報を取得して表示するようにプログラミングします。
注意点とし「詳細・編集」、「削除」へのリンクに $memberData[‘test_id’][$i] を記述し削除する情報を指定しています。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 | <?php include 'class.Member.php'; $Member = new Member(); // 会員情報を取得 $memberData = $Member->getData(); ?><!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>会員情報一覧</title> </head> <body> <header> <h1>会員情報一覧</h1> </header> <section> <table> <tr> <th>詳細</th> <th>会員名</th> <th>年齢</th> <th>登録日</th> <th>更新日</th> <th>削除</th> </tr> <?php for( $i = 0; $i < $memberData['rows']; $i++ ){ ?> <tr> <td><a href="edit.php?id=<?php echo $memberData['test_id'][$i];?>">詳細・編集</a></td> <td><?php echo $memberData['test_name'][$i];?></td> <td><?php echo $memberData['test_age'][$i];?>歳</td> <td><?php echo $memberData['test_create'][$i];?></td> <td><?php echo $memberData['test_update'][$i];?></td> <td><a href="list.php?delete_id=<?php echo $memberData['test_id'][$i];?>">削除</a></td> </tr> <?php } ?> </table> </section> </body> </html> |
データの一覧表示を開発してみて
データの一覧表示は、CRUDの中では比較的簡単に作成できますが、件数が多いとページネーション（ページ送り）をつけたり、検索用のフォームを用意したりと、まだまだブラッシュアップできる部分は多数あります。
今回はコードを簡素化しわかりやすいように全件取得の一覧表示を作成しました。