Я передаю свои изображения через cfcontent call и пытаюсь обновить изображения после того, как пользователи могут повернуть их на 90 градусов.На моей главной странице с фотографиями у меня есть выделенный div с изображением, div с галереей и div с деталями фотографии.При загрузке страницы div / featured / gallery не заполняются, если только не присутствуют переменные сеанса, и в этом случае соответствующие шаблоны включаются.Если элементы не заполнены, нажатие на меню навигационной панели запускает вызовы ajax для загрузки выбранных изображений.
Все это работает хорошо.Моя проблема в том, что когда изображение выбрано и загружено, и когда пользователь хочет повернуть его.Кнопка поворота запускает вызов, чтобы повернуть и сохранить изображение (что работает), а затем пытается обновить div / featured / gallery, чтобы показать обновленное изображение.Вот где это ломается.Хотя изображение поворачивается, и обновление всей страницы показывает его в обновленном виде, вызовы ajax не показывают обновленное изображение.Эти вызовы обновления успешно использовались при подключении к другим обработчикам событий, поэтому я не думаю, что они вызваны неправильно.Возможно, есть что-то загадочное в использовании cfcontent?
Вот моя попытка выделить соответствующие биты:
Главная страница:
<div id="featured_pic">
<cfif isDefined('session.currentPhotoName') and #session.currentPhotoName# neq "">
<cfinclude template="featuredImage.cfm">
</cfif>
</div>
<div id="gallery_container">
<cfif isDefined('session.category') and isDefined('session.param')
and #session.category# neq "" and #session.param# neq ""
>
<cfinclude template="photoGallery.cfm">
</cfif>
</div>
Featured image.cfm:
<cfif isDefined('url.file_name')>
<cfset session.currentPhotoName = #url.file_name#>
</cfif>
<cfoutput>
<cfset thisImage = #session.currentPhotoName#>
<img
id="photoPlaceholder"
src="/#application.root_name#/administration/PhotoManagement/displayPhoto.cfm?thisImage=#thisImage#"
width="600px"
/>
</cfoutput>
DisplayPhoto.cfm:
<cfcontent
type = "image/*"
file = "C:\#replace(application.local_file_path, '/', '')#\Photos\#thisImage#"
deleteFile = "No"
>
И JS, чтобы это произошло (в $ (document) .ready ()):
$('#rotate').live('click', function(){
var id = $('#docID').val();
var title = $('#title').text();
title = $.trim(title);
// rotate the image and refresh the details container
$('#details_container').load('Administration/PhotoManagement/photoDetails.cfm', {'DOC_ID': id, 'title': title, 'rotateFlag': true}, function(response, status, xhr) {
if (status == "error") {
var msg = "Sorry but there was an error: ";
$("#details_container").html(msg + xhr.status + " " + xhr.statusText);
}
});
// refresh the gallery
var category = $('#currentCategory').val();
var param = $('#currentParam').val();
$.get(
'Administration/PhotoManagement/photoGallery.cfm',
{category:category, param:param},
function(response, status, xhr){
if (status == "error") {
var msg = "Sorry but there was an error: ";
$("#photos").html(msg + xhr.status + " " + xhr.statusText);
} else {
$('#gallery_container').html(response);
}
}
);
// refresh the featured image
$('#featured_pic').load('Administration/PhotoManagement/featuredImage.cfm',
{'file_name': title});
});
Обратите внимание, чтоКак новичок в ajax, я экспериментировал с .load (), .get () и .ajax (), чтобы увидеть, что работает.Из jQuery In Action я понял, что мне следует использовать GET для этих действий, верно?
РЕДАКТИРОВАТЬ: следуя приведенным ниже советам, я попытался назвать его следующим образом:
$.ajax({url:'Administration/PhotoManagement/featuredImage.cfm',
cache: false,
data: {file_name: title},
success: function(response){
$('#featured_pic').html(response);
alert('success');
}
});
и яЯ также пытался установить
$.ajaxSetup({ cache: false});
внутри моего $ (document) .ready (), но безрезультатно.Изображение поворачивается, если я обновляю всю страницу, я вижу изменения, но вызов ajax, хотя и говорит, что мне это удалось, не показывает обновленное изображение.