Я реализовал plupload с помощью внутреннего скрипта ColdFusion (доступен по адресу https://gist.github.com/1116037). ).
Атрибут url на странице загрузки — url : '../upload.cfc?method=upload'. Это просто вызывает функцию внутри скрипта cfc. Это работает нормально. Этот сценарий также создает переменную под названием «ответ» для хранения информации о загруженных файлах.
Проблема, с которой я сталкиваюсь, заключается в доступе к информации, содержащейся в переменной «ответ». Я хотел бы отобразить эту информацию в таблице после того, как все файлы были загружены на сервер.
Я использую queue_widget для своих нужд, думаю, что событие (onComplete) должно быть вызвано для вызова функции для обработки информации в переменной, но я не знаю, как это сделать.
Мне нужно получить доступ к информации, хранящейся в переменной «ответ», предпочтительно в коде ColdFusion. Кому-нибудь уже удалось заставить plupload работать с ColdFusion?
Любая помощь, руководство или кодирование будут оценены.
Вот полный код, который я использовал:
Это главная страница - queue_widget.cfm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Plupload - Queue widget example</title>
<link rel="stylesheet" href="../../js/jquery.plupload.queue/css/jquery.plupload.queue.css" type="text/css" media="screen" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" src="../../js/plupload.js"></script>
<script type="text/javascript" src="../../js/plupload.flash.js"></script>
<script type="text/javascript" src="../../js/jquery.plupload.queue/jquery.plupload.queue.js"></script>
</head>
<body>
<h1>Queue widget example</h1>
<p>Shows the jQuery Plupload Queue widget and under different runtimes.</p>
<div style="float: left; margin-right: 20px">
<h3>Flash runtime</h3>
<div id="flash_uploader" style="width: 700px;">Your browser does not have Flash installed!</div>
</div>
<br style="clear: both" />
<cfoutput><cfset mnum=6></cfoutput>
<script type="text/javascript">
$(function() {
// Setup flash version
$("#flash_uploader").pluploadQueue({
// General settings
runtimes : 'flash',
url : '../upload.cfc?method=upload',
max_file_size : '1mb',
max_file_count: <cfoutput>#mnum#</cfoutput>, // You can limit the num of files that can be uploaded by manipulating the mnum variable above
unique_names : false,
multiple_queues : true,
multi_selection: true,
filters : [
{title : "Image files", extensions : "jpg,gif,png"}
],
init : {
FilesAdded: function(up, files) {
plupload.each(files, function(file) {
if (up.files.length > <cfoutput>#mnum#</cfoutput>) {
up.removeFile(file);
}
});
if (up.files.length >= <cfoutput>#mnum#</cfoutput>) {
$('#pickfiles').hide('slow');
}
},
FilesRemoved: function(up, files) {
if (up.files.length < 1) {
$('#pickfiles').fadeIn('slow');
}
}
},
resize : {width : 300, height : 10000, quality : 90}, // forces images to be resized to a width of 300px if wider than 300px
preinit: attachCallbacks,
UploadComplete: function(up, file, response) {
if ($("#result").length > 0){
$("#results").prepend(info.response);
} else {
$("#flash_uploader").after("<div id='results'>"+info.response+"</div>");
}
},
flash_swf_url : '../../js/plupload.flash.swf'
});
});
// Where should we go after upload
function attachCallbacks(Uploader){
Uploader.bind('FileUploaded', function(Up, File, response){
function IsJson(response) {
alert('Response from server: ' + response.file); // for testing only
counter++
var newRow = '<tr><td><input type="hidden" name="file_'+counter+'" value="'+response.file+'">'
newRow += 'Label the file: '+response.file+' <input type="text" name="filename_'+counter+'"></td></tr>'
$("#detail").append(newRow)
}});
};
</script>
<div id="results"></div>
<table id="detail">
</table>
<cfif IsDefined('response')><cfdump var="#response#"></cfif>
</body>
</html>
Это страница обработки бэкэнда - upload.cfc
<cfcomponent>
<cffunction name="upload" access="remote" returntype="struct" returnformat="json" output="false">
<cfscript>
var uploadDir = expandPath('/uploads/'); // should be a temp directory that you clear periodically to flush orphaned files
var uploadFile = uploadDir & arguments.NAME;
var response = {'result' = arguments.NAME, 'id' = 0};
var result = {};
</cfscript>
<!--- save file data from multi-part form.FILE --->
<cffile action="upload" result="result" filefield="FILE" destination="#uploadFile#" nameconflict="overwrite"/>
<cfscript>
// Example: you can return uploaded file data to client
response['size'] = result.fileSize;
response['type'] = result.contentType;
response['saved'] = result.fileWasSaved;
return response;
</cfscript>
</cffunction>
</cfcomponent>
Вы можете попробовать приведенный выше пример здесь: [url] www.turn2cash.co.uk/plupload/examples/jquery/queue_widget.cfm [/url]
Как упоминалось выше, скрипт хорошо работает с загрузкой (в данном случае) до 6 изображений, что определяется переменной mnum. Мне нужна помощь в том, как получить доступ к загруженным файлам (с обновлением страницы) и иметь возможность манипулировать ими.
Я настроил пример (используя cffileupload) того, что мне нужно здесь [url] www turn2cash.co.uk/a/index.cfm [/url] Хотя это работает нормально, для этого требуется обновление страницы, что я и делаю. пытаясь избежать.
Пожалуйста, окажите любую помощь, которую вы можете.
Добавлено 7 сентября 2012 г.
Я попробовал оба метода, предложенные Мигелем, но не добился положительных результатов. Они фактически заставили пользовательский интерфейс вообще не сеять. Однако я нашел это и попробовал:
preinit: attachCallbacks,
UploadComplete: function(up, file, response) {
if ($("#result").length > 0){
$("#results").prepend(info.response);
} else {
$("#flash_uploader").after("<div id='results'>"+info.response+"</div>");
}
},
flash_swf_url : '../../js/plupload.flash.swf'
});
});
// Where should we go after upload
function attachCallbacks(Uploader){
Uploader.bind('FileUploaded', function(Up, File, Response){
alert('Response from server: ' + Response.response);
});
};
</script>
Теперь я получаю предупреждение, отображающее:
Response from server: {"saved":true,"result":"home.png","id":"0","size":"5988","type":"image"}
Это, по крайней мере, доказывает, что скрипт cfc работает и возвращается переменная 'response'. Я до сих пор не знаю, как использовать эту информацию, так как не знаю jquery, ajax или javascript. Пожалуйста, помоги, если можешь.