情弱エンジニアのなかのblog

一人前のエンジニアになる為のブログです

サイトレビューサイト制作への道その7

画像の名前を保存&ユーザ画面の準備

1.画像の名前をidにする

2.エディットで画像を変える

3.ユーザー画面を用意する

4.まとめ

1.画像の名前をidにする

前回画像を保存出来るようになったので今回はその画像の名前をidの番号にします。 「サイトコントローラー」の「add」をこのように編集していきます。

            //一時保存画像の名前を保存
            $img = $this->request->data('Site.img_src.tmp_name');
            //画像の名前を保存
            $imgname = $this->request->data('Site.img_src.name');
            //ファイルパスを保存
            $uploaddir = "C:" . DS . "xampp" . DS . "htdocs" . DS . "sites" . DS . "webroot" . DS . "upimg" . DS;
            
            //idを取得する
            $iddata = $this->request->data('Site.id');
            //画像のファイルパス
            $img_src = IMAGES . $img;
            //ファイルパス保存
            $root = "http://localhost/sites/upimg/";
            //データにファイル名を表示する
            $request['Site']['img_src'] = "";
            //データにサイト名を保存する
            //$request['Site']['site_name'] = $sitenameid;
            //カテゴリーデータ保存
            $this->set('categorydata', $request);

            $this->Site->create();
                   
            //保存
            if ($this->Site->save($request)) {                      //保存する    
                //idの取得
                $id = $this->Site->getLastInsertID();
                //結果的に使う画像を保存
                $uploadfile = $uploaddir . "$id.jpg"; //basename($imgname);
                
                //ファイル移動
                move_uploaded_file($img, $uploadfile);   //.$fileName['img']    //$fileName[

保存の後でないとidが振られないようです、(これを理解するのにだいぶ時間がかかりましたorz) ともあれこれで画像の名前がidになり他とかぶりません。

2.エディットで画像を変える

次はエディットで画像を変更するためにまず「ビュー」の「エディット」を変えます。

 //画像を選択する
                echo $this->Form->input('img_src',array(
                            'type'=>'file',
                            'div'=>false,
                            //'required'=>'required',
                            ));

「add」と同様にこれを追加します。

次に「コントローラー」でも名前の保存をします。

//========================================================================================
            //画像データ保存
            //========================================================================================
            //$id = find('first', id);
            //サイト名取得
            $sitenameid = $this->request->data('Site.site_name');
            //一時保存する画像の名前を保存
            $img = $this->request->data('Site.img_src.tmp_name');
            //画像の名前を保存
            $imgname = $this->request->data('Site.img_src.name');
            //ファイルパスを保存
            $uploaddir = "C:" . DS . "xampp" . DS . "htdocs" . DS . "sites" . DS . "webroot" . DS . "upimg" . DS;
            
            //idを取得する
            $iddata = $this->request->data('Site.id');
            //画像のファイルパス
            $img_src = IMAGES . $img;
            //ファイルパス保存
            $root = "http://localhost/sites/upimg/";
            //データにファイル名を表示する
            $request['Site']['img_src'] = "$iddata.jpg";
            //結果的に使う画像を保存
            $uploadfile = $uploaddir . "$iddata.jpg"; //basename($imgname);

だいたいコピペで済みますね。

3.ユーザー画面を用意する

次にとうとうユーザー画面の編集に入っていきます。 そのためにbootstrapというものを使っていきます。

これを使うことで今までの画面にも色々な変化を及ぼします。 f:id:nonaka-katuma-hal:20160812181924j:plain

そしてユーザー画面を制作するために「サイトコントローラー」をコピーして「WebsController」を作ります。 中身のエディットとaddは要らないので削除して、クラス名を変更します。

class WebsController extends AppController {

そしてビューに「WebsController」用のインデックスとビューを作ります。これもコピーで名前を「Webs」フォルダとします。 f:id:nonaka-katuma-hal:20160812182420j:plain 中身は f:id:nonaka-katuma-hal:20160812182520j:plain この二つでOK!

4.まとめ

ユーザー画面の制作に入ったもののやはり苦労の連続でそうそううまいことはいかないですねー