【やりたいこと】
CakePHPでAjaxを使用して、画面遷移なしにフォームの値をDBに保存したい
【質問の内容】
今回が初の質問になります。具体性など、不足な部分あると思いますがよろしくお願いします。
・CakePHPを使用して、ctpファイル上にフォームを作成しその入力の値をDBに保存しようとしています。通常の方法(コントローラでPOST値を取得し、それをsaveメソッドでDB保存)でのDBへの値の保存はできていますが、そのフォームデータの保存をAjaxを使用して画面遷移なく行いたいと思っていますが上手くいきません。
【困っていること】
・jsファイル上で、値の送信タイプをPOSTに指定するとコンソール上でエラーになってしまいます。しかし、この送信タイプをGETに変更すると通信完了のsuccessメソッドが表示されます。なぜPOST送信になるとエラーになってしまうのか、解決の糸口だけでも提示していただけると嬉しいです。
【エラーメッセージ】(コンソール上に表示されるメッセージ)
toolbar.js?1573353662:91 POST http://localhost/youtube/playlists/index2ajax 403 (Forbidden)
該当のソースコード(Controller)
<?php namespace App\Controller; use App\Controller\AppController; class PlaylistsController extends AppController { public function index2(){ $playlist = $this->Playlists->newEntity(); var_dump($this->request->data); if($this->request->is('ajax')){ exit; $playlist= $this->Playlists->patchEntity($playlist,$this->request->data); $this->Playlists->save($playlist); return $this->redirect(['action'=>'index']); } $this->set(compact('playlist')); } //確認用 public function index2ajax(){ $this->autoRender = FALSE; $result = []; $result['name'] = "yamada"; $result['age'] = 23; echo json_encode($result); } } }
該当のソースコード(jsファイル:test.js)
コード$(function(){ $("#testfunction").click(PlaylistIndexRequest); }); function PlaylistIndexRequest(event){ var data = $('#testfunction').serialize(); $.ajax({ url: "/youtube/playlists/index2ajax", type: "POST", data: data, dataType: "json", success: testfunctionSuccess, error: testfunctionError, }); function testfunctionSuccess(result){ console.log("success"); } function testfunctionError(result){ console.log("error"); } }
###該当のサンプルコード(ctpファイル:playlist.ctp)
コード<?php $this->prepend('script', $this->Html->script('test'));?> <?= $this->Form->create($playlist,["id"=> "playlistIndex"])?> <?= $this->Form->input('video')?> <?= $this->Form->input('name')?> <?= $this->Form->button("submit",["type"=>"button","id"=>"testfunction"])?> <?= $this->Form->end()?>
使用言語
PHP version7.3.12 cakePHP
CakePHP version 3.8
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/12/23 12:00