【第9話】作って学ぶPHP!初心者による実践録!~追加画面~

これからPHPの勉強を始める方に向けて!

PHP初心者の私が、実際に簡単なWebサイトを作成しながら学んでいく実践録です!!

この記事の目標は、同じく初心者の方が、実際に「作って学ぶ」を実践出来る内容を提示することです。

私自身は、他言語(C#、Javascriptなど)でのプログラミング経験がありますが、プログラミングを始めて勉強する方でも理解出来るように心がけて書いていきます。

ただし、HTML・CSSに関しては説明を省きます。ご了承ください。

また、分かりにくい所等あればコメント等頂けたら凄く喜びます。

こちらの記事は、「第9話」となっております。
第1話から読むことをオススメします!

 

 

前回まで

第8話では、一覧画面が完成するところまで終わりましたね!

今回からは、「追加画面」の作成に入っていきます!!

 

現状を見ておきましょう

とりあえず現状がどうなっていたかを確認しておきます!

まずは画面上の見た目から。

 

追加画面

追加画面

 

こんな感じ。
デザインに関しては、このまま変更なしでオッケーですね!

続いてソース側。
ヘッダー部分は一覧画面と同じ構造なので、formの部分のみを見ておきます。

form

form

こんな感じでしたね。
では、さっそく追加画面に動きを付けていきましょう!!

 

追加画面の作成

さっそく追加画面の作成に入っていきます!!

 

最初に1つだけ注意点。
デザインで「form」を使っているので、POSTを使用していきますが、POSTに関しての説明はPHPから外れる部分になってしまうので、あまり詳しく説明をしません。

 

GETとPOSTに関しては、Webサイトを作成する上で必要不可欠な知識となるので、勉強をしておくことをオススメします。
わかりやすいサイトは、こちら。
PHPでフォームからデータを受け取る方法(GETとPOST)

とは言え、ざっくりとは説明を入れますのでとりあえず進めたい!!という方は、後から勉強する!とかでも良いかと思います。

それでは、さっそく作成をしていきます!

実装しないといけない内容

追加画面で実装しないといけない内容を一度書き出してみます。

・POST発生時のデータ受け取り
・必須項目のチェック処理
・チェック後の処理
・登録処理
・登録後処理

こんな所でしょうか。

 

上から順に開発をしていきますが、
メインロジックであるPOSTの所は、難しい部分でもあるので、今回はその部分だけの説明を行っていきます!





POSTを発生させる

さっそくPOSTの部分を考えていきます。

まずはPOSTの処理を走らせる所ですが、実はデザインを作成した時点で、POSTの処理が走るようにロジックを書いています。

POST

POST

formタグの「method」の部分にPOSTって書いておくだけ!
それだけで、submitのボタンを押した時にPOSTが走ります。

POSTは、ざっくり言うと

ユーザーが入力した内容をサーバー側が受け取ることが出来る機能
だと認識してもらえればオッケーです!

 

もちろん、全然知識としては足りないので後々勉強をしないといけませんが、ここではいったんそのぐらいの認識で。

 

POST発生を検出する

POSTが発生すると、画面の再読み込みをしている状態と同じ状態になります。

なので、初回にサーバー側でクライアントに表示するHTMLを作成するロジックが走るということ。

 

ということは、初回のページ表示時なのか、それともPOSTが実行された時なのかを判断してあげる必要があります。

そのロジックがこれ。

$_SERVER[‘REQUEST_METHOD’] === ‘POST’
 

$_SERVER」は、サーバーが絶対に持っている変数だと認識してもらえればオッケーで、その変数の中の「REQUEST_METHOD」を取得することで、POSTが発生した時の処理であるかを判断することが出来ます。

ちょっと難しいかもしれないですけど、まあ定型文として覚えてしまった方が早いかもしれません。

 

入力された値を受け取るときは注意

クライアントから入力された値をサーバーが受け取るときには、注意が必要です。

それは、

HTML上で意味のある文字列を入力されていた場合などに、不具合を発生してします可能性がある
ということ。

それを防いでくれるのがhtmlspecialcharsです!

入力された文字を受け取るときには、htmlspecialcharsを使う必要がないか必ず考えましょう!!

 

使い方は、これだけ。
htmlspecialchars(‘入力された文字列’, ENT_QUOTES, ‘UTF-8’);

これだけで、HTML上で意味のある文字が存在していたとしても、不具合を誘発しないように防いでくれます!

 




htmlspecialcharsを拡張する

今回のように、タイトル・URL・メモといった複数の値が入力されてPOSTが発生する場合、複数の値に都度「htmlspecialchars」を使うのはめんどくさいと思います。

なので、ちょっと「htmlspecialchars」を一度ですませられるように機能を拡張しておきましょう!

ということで、functionを作成します!
POSTでのデータ受け取りは配列になっているので、配列のデータを全てに対してhtmlspecialcharsを実行するようなfunctionです!

function sethtmlspecialchars($data){
 if (is_array($data)) {
  return array_map(“sethtmlspecialchars”,$data);
 } else {
  return htmlspecialchars($data, ENT_QUOTES, ‘UTF-8’);
 }
}

「array_map」はちょっと難しい内容なので、説明を省きますが、上で説明した内容を良い感じにやってくれるという認識を持ってくれればオッケーです!

入力値を受け取る

入力された値を実際に受け取るときは、POSTの配列から要素を取り出していくことになります。

「タイトル」で入力された値を取得する場合を考えてみます。
値の取得は、

$_POST[“title”]
このように書くことで行うことが出来ます。

POSTの配列の要素名で「title」を指定して取得している感じですね!

ここの要素名に関しては、inputタグの「name」で指定した名前が入っています!!

タイトル

タイトル

 

ここまでをまとめて書いてみる

ここまでの知識で書けるロジックをいったん書いてみましょう!

まとめ

まとめ

 

1つ説明していなかった部分がありますね。

POSTの値を取り出す所で、「trim」を使っていますがこれは、入力された値の最初と最後にスペースがあったら取り除くようにしているだけです!

 

質問・指摘はこちらから

プログラミング初心者の方は、本当にわからないことだらけだと思います。
そんな方へ、少しでも役立つことが出来れば嬉しいです。

分からない所があれば、こちらの記事にコメントを入れてください。
出来る限り回答していきます!
Twitterからの質問でもかまいません。

また、間違い等あればご指摘頂けると幸いです。
PHPに関しては、私自身キャッチアップ中のため至らない点もあるかと思います。
ご指摘頂いた内容は、随時修正していきます!

 

こちらの題材としている「ブックマーク管理サイト」をリリースしました!
使い方をこちらの記事で紹介していますので、使って頂けると嬉しいです!!

【リリース】超シンプル!!ブックマークを管理するだけのサイト!

 

それでは、
のらくら でした!!

1 Comment

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です