以下是我为重命名文件所做的工作: Dropzone.js - How to change file name before uploading to folder
来自index.php:
$(document).ready(function() {
Dropzone.autoDiscover = false;
var fileList = new Array;
var i =0;
$("#some-dropzone").dropzone({
addRemoveLinks: true,
init: function() {
// Hack: Add the dropzone class to the element
$(this.element).addClass("dropzone");
this.on("success", function(file, serverFileName) {
fileList[i] = {"serverFileName" : serverFileName, "fileName" : file.name,"fileId" : i };
//console.log(fileList);
i++;
});
this.on("removedfile", function(file) {
var rmvFile = "";
for(f=0;f<fileList.length;f++){
if(fileList[f].fileName == file.name)
{
rmvFile = fileList[f].serverFileName;
}
}
if (rmvFile){
$.ajax({
url: "http://localhost/dropzone/sample/delete_temp_files.php",
type: "POST",
data: { "fileList" : rmvFile }
});
}
});
},
url: "http://localhost/dropzone/sample/upload.php"
});
});
来自upload.php:
<?php
$ds = DIRECTORY_SEPARATOR; // Store directory separator (DIRECTORY_SEPARATOR) to a simple variable. This is just a personal preference as we hate to type long variable name.
$storeFolder = 'uploads'; // Declare a variable for destination folder.
if (!empty($_FILES)) {
$tempFile = $_FILES['file']['tmp_name']; // If file is sent to the page, store the file object to a temporary variable.
$targetPath = dirname( __FILE__ ) . $ds. $storeFolder . $ds; // Create the absolute path of the destination folder.
// Adding timestamp with image's name so that files with same name can be uploaded easily.
$date = new DateTime();
$newFileName = $date->getTimestamp().$_FILES['file']['name'];
$targetFile = $targetPath.$newFileName; // Create the absolute path of the uploaded file destination.
move_uploaded_file($tempFile,$targetFile); // Move uploaded file to destination.
echo $newFileName;
}
?>
新文件delete_tmp_files.php:
<?php
$ds = DIRECTORY_SEPARATOR; // Store directory separator (DIRECTORY_SEPARATOR) to a simple variable. This is just a personal preference as we hate to type long variable name.
$storeFolder = 'uploads';
$fileList = $_POST['fileList'];
$targetPath = dirname( __FILE__ ) . $ds. $storeFolder . $ds;
if(isset($fileList)){
unlink($targetPath.$fileList);
}
?>
这里我需要dropzone来调用PHPExcel或sheetJS。我在这里使用ajax在静态页面中将sheetJS解析为CSV:
<html>
<head>
<title>AJAX XLS TEST</title>
</head>
<body>
<br/><div id="fileurl"></div>
<pre id="out"></pre>
<br />
<script src="js/iemagic.js"></script>
<script src="js/shim.js"></script>
<script src="js/jszip.js"></script>
<script src="js/xlsx.js"></script>
<script>
function to_csv(workbook) {
var result = [];
workbook.SheetNames.forEach(function(sheetName) {
var csv = XLSX.utils.sheet_to_csv(workbook.Sheets[sheetName]);
if(csv.length > 0){
result.push("SHEET: " + sheetName);
result.push("");
result.push(csv);
}
});
return result.join("\n");
}
function process_wb(wb) {
var output = to_csv(wb);
if(out.innerText === undefined) out.textContent = output;
else out.innerText = output;
if(typeof console !== 'undefined') console.log("output", new Date());
}
var url = "uploads/fw.xls";
var oReq;
if(window.XMLHttpRequest) oReq = new XMLHttpRequest();
else if(window.ActiveXObject) oReq = new ActiveXObject('MSXML2.XMLHTTP.3.0');
else throw "XHR unavailable for your browser";
document.getElementById('fileurl').innerHTML = '<a href="' + url + '">Download file</a>';
oReq.open("GET", url, true);
if(typeof Uint8Array !== 'undefined') {
oReq.responseType = "arraybuffer";
oReq.onload = function(e) {
if(typeof console !== 'undefined') console.log("onload", new Date());
var arraybuffer = oReq.response;
var data = new Uint8Array(arraybuffer);
var arr = new Array();
for(var i = 0; i != data.length; ++i) arr[i] = String.fromCharCode(data[i]);
var wb = XLSX.read(arr.join(""), {type:"binary"});
process_wb(wb);
};
} else {
oReq.setRequestHeader("Accept-Charset", "x-user-defined");
oReq.onreadystatechange = function() { if(oReq.readyState == 4 && oReq.status == 200) {
var ff = convertResponseBodyToText(oReq.responseBody);
if(typeof console !== 'undefined') console.log("onload", new Date());
var wb = XLSX.read(ff, {type:"binary"});
process_wb(wb);
} };
}
oReq.send();
</script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-36810333-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>
问题1:如何让dropzone调用此ajax csv输出? A.有“queuecomplete”但是在哪里放置完整代码(body?head?index.php?Upload.php?另一种选择是使用PHPexcel(下面)但又不确定如何在重命名后让dropzone调用它完成:
| Excel To Array
|--------------------------------------------------------------------------
| Helper function to convert excel sheet to key value array
| Input: path to excel file, set wether excel first row are headers
| Dependencies: PHPExcel.php include needed
*/
$filePath = "uploads/fw.xls";
function excelToArray($filePath, $header=true){
//Create excel reader after determining the file type
$inputFileName = $filePath;
/** Identify the type of $inputFileName **/
$inputFileType = PHPExcel_IOFactory::identify($inputFileName);
/** Create a new Reader of the type that has been identified **/
$objReader = PHPExcel_IOFactory::createReader($inputFileType);
/** Set read type to read cell data onl **/
$objReader->setReadDataOnly(true);
/** Load $inputFileName to a PHPExcel Object **/
$objPHPExcel = $objReader->load($inputFileName);
//Get worksheet and built array with first row as header
$objWorksheet = $objPHPExcel->getActiveSheet();
//excel with first row header, use header as key
if($header){<SNIP>
我真的认为PHPexcel在从xls中剔除特定数据时要容易得多,因为我只需要特定的字段来填充以下的javascript表单,但同样,我在哪里放置PHPexcel脚本?我是否使用queuecomplete来调用文件?我想如果我使用queuecomplete并引用phpexcel_parse.php我可以从那里得到它但我似乎无法让dropzone在上传和重命名完成后对文件做一些事情。任何帮助深表感谢。谢谢!