jquery + webforms: вызовите Ashx и в результате обновите изображение

Question

Рассмотрим страницу ASP.NET, используя библиотеку jQuery Загрузить.

Вот последовательность событий на странице веб -формирования ASP.NET:

1. Пользователь нажимает на управление загрузкой файла. Простой старый HTML <input type="file" />
2. Пользователь выбирает файл изображения из их системы, используя диалоговое окно «Просмотр». Все работают нормально.
3. Спутниковое мероприятие JQUERY. Он вызывает ASHX, который правильно загружается, как и ожидалось.
4. Теперь, когда файл загружен, Как я могу изменить <asp:image> на странице Calling .aspx? Действительно хотел бы сделать это без возврата!

Вот код!

<asp:Image ID="imgChangeMe" runat="server" /><br />
<input type="file" name="uploadify" id="uploadify" />

<script type="text/javascript">
    $(document).ready(function() {
       $("#uploadify").uploadify({
        'uploader'       : 'scripts/uploadify/uploadify.swf',
    'script'         : 'uploadify.ashx',
    'folder'         : 'uploads',
    'queueID'        : 'fileQueue',
    'auto'           : true,
    'multi'          : true
        });
       });
 </script>

Вопрос:

Как бы вы внедрили изменение <asp:image> Чтобы отразить изображение, которое только что загрузил пользователь?

Этот вопрос действительно не должен быть связан с библиотекой загрузки, а скорее как реагировать на возврат/конец выполнения .ASHX? Следует ли это сделать в другом методе jQuery

Answer 1

Вы определенно можете сделать это, не делая обратного перерыва. Все, что вам нужно, это получить путь загруженного изображения. Из Uploadify Документация, я думаю, вы можете получить путь от fileObj свойство или вернуть его с сервера в response property:

fileObj: Объект, содержащий подробную информацию о выбранном файле.

• имя - Имя файла
• Путь к файлу - Путь на сервере к загруженному файлу
• размер - Размер в байтах файла
• Дата создания - Дата создания файла
• модификация - Последняя дата, когда файл был изменен
• тип - Расширение файла, начиная с '.' '.'

отклик: Данные, отправленные обратно с сервера.

Теперь, если ваше изображение ASPX похоже на:

<aspx:image id="myImage"...../>

Вы можете установить это следующим образом:

 //Uploadify hookup

 'onComplete': function(evt, qid, fObj, res){
     var f = fObj.filePath + fObj.name; //PUT SLASH IF REQUIRED BETWEEN
     $("img[id$='myImage']").attr("src",f);

     //for future readers who might be using master pages.
     $('#<%=myImage.ClientID %>').attr("src", f);
     $('#<%=txtMyImgPath.ClientID %>').val(f);
 }