CakePHPでjquery ajaxリクエストを実行するにはどうすればよいですか？

Question

私はCakePHPでAjaxを使用しようとしています。

私は一連のボタンが付いたページを持っています - これらのいずれかをクリックすると、現在のページに特定の内容が表示されます。ページがリロードされないことは重要です。映画が表示され、ムービーをリセットしたくないからです。

それぞれにそれぞれ異なる内容のボタンがいくつかあります。このコンテンツは潜在的にかなり大きいので、必要になるまで読み込む必要はありません。

通常、jQueryでこれを行いますが、CakePHPで動作させることはできません。

は、これまでのところ、私が持っている：私は新しいが欲しいところです「filmNotebook」と呼ばれるdiv要素があり、この下に

$this->Html->link($this->Html->image('FilmViewer/notes_link.png', array('alt' => __('LinkNotes', true), 'onclick' => 'showNotebook("filmNotebook");')), array(), array('escape' => false)); 

：ビューで

、ボタンコントロールは、このようなものです表示するコンテンツ。

はdiv要素に示さなるだろう平野コンテンツを生成するために

function showNotebook(divId) { 
// Find div to load content to 
var bookDiv = document.getElementById(divId); 
if(!bookDiv) return false; 
$.ajax({ 
    url: "ajax/getgrammar", 
    type: "POST", 
    success: function(data) { 
    bookDiv.innerHTML = data; 
    } 
    }); 
return true; 
} 

が、私はroutes.phpの中で次のように設定します。（ウェブルート/スクリプトで）私のfunctions.jsファイルで

私はこの機能を持っています：films_controller.phpで

Router::connect('/ajax/getgrammar', array('controller' => 'films', 'action' => 'getgrammar')); 

、機能getgrammarは：

function getgrammar() { 
    $this->layout = 'ajax'; 
    $this->render('ajax'); 
    } 

レイアウトファイル

を、現在のビューajax.ctpだけです：：ちょうど持って

<div id="grammarBook"> 
Here's the result 
</div> 

問題であり、私はボタンをクリックしたときに、私はデフォルトのレイアウトを取得すること（ページが私のページ内に表示されますようなので、それはです）その中に映画のインデックスページがあります。それはfilms_controller.phpで正しいアクションが見つからないかのようです。

私はCakePHPのマニュアル（http://book.cakephp.org/view/1594/Using-a-specific-Javascript-エンジン）。

私は間違っていますか？これを行うためのより良い方法の提案がありますが、今後の参考のためにAjaxがどのように機能するかを知りたいと思います。

誰もが提供できるお手伝いをありがとう。

Answer 1

あなたが表示するものはすべて問題なく表示されます。 ajaxレイアウトが存在しない場合は、デフォルトのレイアウトが使用されるため、ajaxレイアウトがそこにあることを再度確認します。あなたが計画しているように物事が行くかどうかを確認するためにケーキの火薬とログ機能を使用してください。

さらにいくつかの提案：「ajax/getgrammar」にPOSTしてから「films/getgrammar」にリダイレクトする必要があるのはなぜですか？そして、ajax.ctpビューをレンダリングしますか？それは私には重複しているようです。 ajaxを 'films/getgrammar'と呼ぶことができます。ルータルールは必要ありません。 ajax.ctpをgetgrammarに変更することができます。CTP、あなたは必要はありません$this->render('ajax');

Answer 2

これは、AJAX呼び出し

$(function() { 
    $("#element", this).keyup(function(event) { 
     if($(this).val().length >= 4) { 
      $.ajax({     
       url: '/clients/index/' + escape($(this).val()), 
       cache: false, 
       type: 'GET', 
       dataType: 'HTML', 
       success: function (clients) { 
        $('#clients').html(clients); 
       } 
      }); 
     } 
    }); 
}); 

あるこの

public function index($searchterm=NULL) { 

if ($this->RequestHandler->isAjax()) { 

     $clients=$this->Client->find('list', array(
      'conditions'=>array('LOWER(Client.lname) LIKE \''.$searchterm.'%\''), 
      'limit'=>500 
     )); 

     $this->set('clients', $clients); 
} 

}

AJAXによって呼び出されるアクション

Answer 3

これはcakephp 3.xでフォームを送信するために使用する関数です。甘いアラートを使用しますが、これは通常のアラートに変更することができます。これは非常に変数です。コントローラにアクションを投入してフォームの送信をキャッチするだけです。また、ロケーションリロードは、ユーザーに即時のフィードバックを与えるためにデータをリロードします。それを取り出すことができます。

$('#myForm').submit(function(e) { 
    // Catch form submit 
    e.preventDefault(); 

    $form = $(this); 
    // console.log($form); 
    // Get form data 
    $form_data = $form.serialize(); 
    $form_action = $form.attr('action') + '.json'; 
    // Do ajax post to cake add function instead 
    $.ajax({ 
     type : "PUT", 
     url : $form_action, 
     data : $form_data, 
     success: function(data) { 
      swal({ 
       title: "Updated!", 
       text: "Your entity was updated successfully", 
       type: "success" 
      }, 
      function(){ 
        location.reload(true); 
      }); 
     } 
    }); 
});