CakePHP：AJAXを使用してDIVコンテンツを更新する

Question

settings.ctpファイルの中に外部PHPファイル[name＃settings_profile.php]をロードするテーブルがあります。 [ソースコードからコピーされ、以下のようsettings_profile.phpからsettings.ctpから

コードスニペット

<table> 
    <tr> 
     <td rowspan="2" id="upload-response-message"> 
      <?php include("settings_profile.php"); ?> 
     </td> 
    </tr> 
</table> 

settings_profile.php

<?php 

$image_path = $user['User']['image_path']; 
if (!empty($image_path)) { 
    echo $this -> Image -> resize($image_path, 100, 200); 
}else{ 
    echo 'EMPTY' ; 
} 
?> 

出力が生成され

<table> 
    <tr> 
     <td rowspan="2" id="upload-response-message"> One 
      <img src="/dearmemoir/uploads/resized/image.jpg" alt="thumb" /> 
     </td> 
    </tr> 
</table> 

の3210の

内容は、AJAXを使用してコントローラを呼び出すことによって更新され、私が使用してテーブル内のsetting_profile.phpファイルを再ロードしようとしています -

function showUploadResponse(data) { 
     alert (data.status); 
     if(data.status == 1) { 
     $("#upload-response-message").load("settings_profile.php #upload-response-message");  
     } 

    } 

をしかし、コンテンツがページに更新されていませんでした。どんな助け？

Answer 1

これを行うことで、MVCのパラダイムとCakePHPの規約を破っています。外部PHPファイルをCakePHPヘルパーではないビューに含めている場合は、何か間違っています。

これがすべてsettings_profile.phpにある場合は、それを削除してコントローラまたはコンポーネントに機能を移動します。次に、ビューに渡される変数にイメージを割り当てます。

Ajaxを使用してサーバーにコールバックすると、ビュー内のインクルードされたコードを再度呼び出すために、ページが再ロードされません。代わりに、サイズ変更されたイメージに関する情報をjavascriptファイルに渡し、javascriptを使用してテーブルを更新します。

//Pseudo Code 

//Page is Loaded 

//Ajax call made back to the server to resize the image 
//Server resizes the image and sends the new image src back to the script 
{Image:{name: "newImage", src: "/dearmemoir/uploads/resized/image1.jpg"}} 
var returnedData = resultsFromAjax; 

//Use javascript to update the image 
var imgElement = document.getElementById('ProfileImageId').setAttribute("src", returnedData.Image.src); 

これで画像が更新されます。