CakePHP: обновление содержимого DIV с помощью AJAX - PullRequest
0 голосов
/ 11 января 2012

У меня есть таблица, в которую я загружаю внешний файл php [name # settings_profile.php] внутри файла settings.ctp.

Фрагмент кода из 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' ;
}
?>

Вывод файла settings_profile.php генерируется следующим образом [скопировано из исходного кода]

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

Содержимое $user['User']['image_path'] обновляется путем вызова Controller с помощью AJAX, и я пытаюсь перезагрузить файл setting_profile.php внутри таблицы, используя -

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

    }

Но содержание никогда не обновлялось на странице. Любая помощь?

1 Ответ

0 голосов
/ 11 января 2012

Этим вы нарушаете парадигму 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);

Это должно обновить ваше изображение!

...