Q&A
save()はどこに書いてあるのでしょうか？
やりたいこと
参考サイトをもとに以下コードを書きました。
やりたいこと
このサンプル画面に送信ボタンをつけ、
ボタンが押された時に$photo_post->save()が走る処理を書く
※現在、送信ボタンがないので$photo_post->save()は未実装です。
動きとしては
1.画像を選択するとプレビューの表示、サーバーに画像をアップロード。（実装済み）
2.送信ボタンを押すと「送信完了」メッセージorページに表示or遷移し$photo_post->save()で保存をかける。（未実装）
どうすれば実現可能でしょうか？
動作環境
FuelPHP
PHP 5.6.27
です
html
1 <div class="container clearfix"> 2 <div class="row"> 3 <div class="col-md-12"> 4 <p>画像ファイルを選択してください（複数可)</p> 5 </div> 6 </div> 7 <div class="row"> 8 <div class="col-xs-2"> 9 <span class="fileUpload btn btn-default"> 10 ファイルを選択 11 <input type="file" class="uploadFile" accept="image/*" multiple/> 12 </span> 13 </div> 14 </div> 15 <hr /> 16 <div class="row"> 17 <div class="col-md-12" id="image-files"> 18 <ul class="list-inline list-unstyled"></ul> 19 </div> 20 </div> 21 </div>
js
1<script type="text/javascript"> 2 // bootstrapっぽいプログレスバーのテンプレート 3 var progressTemplate = "<div class=\"list-group-item\"><div class=\"progress progress-striped active\"><div class=\"progress-bar progress-bar-info\" style=\"width: 0%;\"></div></div></div>"; 4 5 $(function(){ 6 7 var def = $.Deferred(); 8 var promise = def; 9 10 $(".uploadFile").change(function() { 11 12 // ファイル分タスクを作成 13 $.each(this.files, function(i, file){ 14 15 promise = promise.pipe(function(response){ 16 17 var newPromise = $.Deferred(); 18 19 var formData = new FormData(); 20 formData.enctype = "multipart/form-data"; 21 formData.append("file", file); 22 $("#progress-container").append(progressTemplate); 23 $.ajax({ 24 url: "/mypage/piy/add", 25 type: 'POST', 26 dataType: 'text', 27 data: formData, 28 cache: false, 29 contentType: false, 30 processData: false, 31 xhr: function() { 32 var xhr = $.ajaxSettings.xhr(); 33 if (xhr.upload) { 34 xhr.upload.addEventListener('progress', function(evt) { 35 var percent = (evt.loaded / evt.total) * 100; 36 $("#progress-container").find(".progress-bar").width(percent + "%"); 37 }, false); 38 } 39 return xhr; 40 }, 41 success: function(imageData) { 42 $("#image-files ul").append("<li><img class='imgView' width=100 height=100 src=\"" + imageData + "\" / ></li>"); 43 }, 44 error: function(xhr, textStatus, errorThrown) { 45 var res = {}; 46 try { 47 res = $.parseJSON(xhr.responseText); 48 } catch (e) {} 49 alert(res.errorMessage); 50 }, 51 complete: function() { 52 $("#progress-container").children().remove(); 53 newPromise.resolve(); 54 } 55 }); 56 return newPromise; 57 }); 58 }); 59 60 def.resolve(); 61 }); 62 }); 63</script>
php
1public function action_add() 2 { 3 //var_dump($_FILES['file']); 4 5 if (isset($_FILES['file']['error']) && is_int($_FILES['file']['error'])) { 6 7 try { 8 9 switch ($_FILES['file']['error']) { 10 case UPLOAD_ERR_OK: 11 break; 12 case UPLOAD_ERR_NO_FILE: 13 throw new RuntimeException('ファイルが選択されていません'); 14 case UPLOAD_ERR_INI_SIZE: 15 case UPLOAD_ERR_FORM_SIZE: 16 throw new RuntimeException('ファイルサイズが大きすぎます'); 17 default: 18 throw new RuntimeException('その他のエラーが発生しました'); 19 } 20 21 // MIMEタイプチェック 22 $mimeTypeCode = @exif_imagetype($_FILES['file']['tmp_name']); 23 if (!in_array($mimeTypeCode, array(IMAGETYPE_GIF, IMAGETYPE_JPEG, IMAGETYPE_PNG), true)) { 24 throw new RuntimeException('画像でないファイル、又は未対応の画像形式です'); 25 } 26 27 28 // 作成したサムネイルデータを取得してbase64エンコード 29 $imageFile = @base64_encode(@file_get_contents($_FILES['file']['tmp_name'])); 30 $mimeTypeStr = @image_type_to_mime_type($mimeTypeCode); 31 32 if ($imageFile && $mimeTypeStr) { 33 // 画像を出力 34 echo "data:" . $mimeTypeStr . ";base64," . $imageFile; 35 36 37 // ファイルアップロード 38 // 初期オブジェクトの生成 39 $photo_post = Model_PhotoPost::forge(); 40 $default_values = array(); 41 $filedata = array(); 42 $error_flag = false; 43 44 $sizes = array( 45 'L' => array('w' => 400, 'h' => 400), 46 'M' => array('w' => 200, 'h' => 200), 47 'S' => array('w' => 100, 'h' => 100), 48 ); 49 50 $filedata = myImage::doConfirm2("clubmember/tmp/", $sizes, array("image/jpeg"), true); 51 if (!empty($filedata['error'])) { 52 parent::$_view->set_global('custom_error', $filedata['error']); 53 $error_flag = true; 54 } 55 56 57 if($error_flag == false) { 58 $filedatas = array( 59 '0' => array( 60 'path' => $filedata['image'][0]->path, 61 'name' => $filedata['image'][0]->name, 62 'ext' => $filedata['image'][0]->ext, 63 ) 64 ); 65 66 //ファイルアップロード 67 $img_id = myImage::doDo($filedatas); 68 if (!empty($img_id)) { 69 $photo_post->img_id = $img_id[0]; 70 } 71 } 72 73 74 } else { 75 // 作成したサムネイルが見つからない、MIMEタイプが取れていない際のエラー 76 throw new RuntimeException('画像表示前になんらかのエラーが発生しました'); 77 } 78 79 } catch (RuntimeException $e) { 80 81 // レスポンスにエラー情報をセットする 82 //header('HTTP', true, 400); // bad requestを返すことにする 83 $json = array(); 84 $json['errorMessage'] = $e->getMessage(); 85 echo json_encode($json,JSON_UNESCAPED_UNICODE); 86 exit; 87 } 88 } 89 exit; 90 }
念のためFuelPHPのバージョンを追記してください（タグにもFuelPHPがあった方が良い）。また、PHPもバージョンを追記してください。
今は送信ボタンを書いていないので$photo_post->save();は未記載です
それですと、質問内容に不整合がおきてしまっているので今一度質問文章の整理をお願いします。ところで、書いたコードが何をやっているか（なぜこのように書かれているか）は理解されてるんですよね？
書いたコードはどういう動きをしているのは理解してい流のでうが、今回このコードに送信ボタンをつけて送信するという時にどういう処理順で書けばいいのかわからず質問させていただきました
誤字がひどく文章が読みづらくなっているので投稿前に一度読み直すようにしてください。
回答1件
0
ベストアンサー
画像アップ時の処理に、画像アップロード成功をもって続けて保存処理をかけば良いのではと。
ただ画像アップはできてsave()失敗というのもなくはないのでその際は浮いてしまうアップした画像を削除するなどの対応は必要ですね。
質問追記を受けての追記
・formの生成
・画像選択・アップロード・プレビュー表示（実装済みとのこと）
・送信（submit）
・submitした値を受け取り
・save
送信から入力受け取りあたりは下記が参考になるかと。
画像をどのようにDBの情報と紐付けるかは仕様次第ですが、アップロード処理の返却値に保存したい情報（画像パスとかIDとか拡張子とか）を含めて返却し、hiddenか何かで持っておき
一緒にsubmitすると良いと思います。
投稿2017/07/26 03:02
編集2017/07/26 03:50総合スコア80850
回答ありがとうございます
いただいた回答では今回やりたいことの回答になっておらず希望している動きではないので
送信ボタンで送信する方法を質問させていただきました。
質問追記部分が多いということはそれだけ説明が足りていないということです。
おそらく前のままだと同じような回答がつくことになりますよ。
そもそもjqueryでformdata送信してアップロードの方が難しいと思うのですが・・・
回答に追記します。
FuelPHP Form送信
とかで検索すれば幾らでも情報は出てくると思います・・・
生PHPでもどのように情報が送信されるかというのは一度基礎として勉強しておいた方が良いですよ。
丸投げと変わりません。
ありがとうございます
formがJavaScriptで宣言されていたのと
一度サーバーに挙げたものと送信しようとしてうまくいかず
今回のような複数非同期でファイルだけ先にアップロードした後送信で保存をかけるののが見当たらなかったので質問させていただきました
知識不足なのは確かなので勉強させていただきます。
問題は解決はしていないので回答は受付中にさせていただきす
「一度サーバーに挙げたものと送信」というのが良く分からないですね。
画像は既にサーバーに送信されているのだからこれをなんとかしようとした場合、
回答の最後に追記しているようにhiddenとかで画像パスが取得できる情報を持っておいてsubmitしたときにhiddenから画像パスを受けとってsave()を実行すれば良いだけのことです（回答を繰り返しています）
hiddenに持っておくのが不安なのであればセッションでもいいですし（あまり強くは推奨しませんが）。
保存はDBか、それとも本番的に起きたい場所かってところですかね。
いずれにせよ、画像パスを文字列で渡したらいいだけのことですよ。
あなたの回答
tips
プレビュー
