2015-07-27 17 views
10

Ich versuche zu laden Versuch ctrlq Code (gefunden hier: http://ctrlq.org/code/19747-google-forms-upload-files) zu ändern, um mehrere Dateien anstelle von 1.mehrere Dateien in Google Drive appscripts

Hier hochladen ist, was ich bisher habe: HTML :

<form id="myForm"> 
    <input type="text" name="myName" placeholder="Name"> 
    <input type="password" name="psw" placeholder="Password"> 
    <input type="text" name="myFolder" placeholder="Folder Name"> 
    <input type="file" name="myFile" id="filesID" multiple> 
    <input type="submit" value="Upload File" 
      onclick="this.value='Uploading..'; 
        google.script.run.withSuccessHandler(fileUploaded) 
        .uploadFiles(this.parentNode); 
        return false;"> 
</form> 

<div id="output"></div> 

<script> 
    function fileUploaded(status) { 
     document.getElementById('myForm').style.display = 'none'; 
     document.getElementById('output').innerHTML = status; 
    } 
</script> 

<style> 
input { display:block; margin: 20px; } 
</style> 

Google Scripts:

function doGet(e) { 
    return HtmlService.createHtmlOutputFromFile('form.html'); 
} 

function uploadFiles(form) { 

    try { 
    var input = document.getElementById('filesID'); 
    var dropbox = "User Files"; 
    var folder, folders = DriveApp.getFoldersByName(dropbox); 

    if (folders.hasNext()) { 
     folder = folders.next(); 
    } else { 
     folder = DriveApp.createFolder(dropbox); 
    } 

    for (var i = 0; i < input.length; i++) { 
     var file = folder.createFile(input.input[i]);  
     file.setDescription("Uploaded by " + form.myName); 
    } 
    return "File uploaded successfully " + file.getUrl(); 

    } catch (error) { 

    return error.toString(); 
    } 

} 

ich Fehler bin immer sagen, dass die Funktion Createfile wird nicht ausgeführt. Ich erwarte, dass die Variable myFile ursprünglich kein Array ist. Wie kann ich alle hochgeladenen Dateien in ein Array einfügen und dann die createFile für jede Datei ausführen?

Dank

+1

Hier ist, wie ich mehrere Datei hochladen: http://stackoverflow.com/questions/28147486/handling-multiple-files-from-an-input-element-in-an-array-with-google-apps -scrip/28161468 # 28161468 –

Antwort

1

Zunächst einmal bewusst sein, dass das multiple Attribut auf dem HTML-<input> Tag auf HTML5 eingeführt wird, und unterstützte nur von modernen Browsern (zB 1.9.2 im Fall von Firefox von Gecko, die 3.6) ab Version

Nun, um eine HTML-Form wäre für mehrere Datei-Upload einzurichten, müssen Sie:

  • explizit geben Sie Ihre HTML-Dokument HTML5 ist. Das Dokument muss beginnen mit:

    <!DOCTYPE html>

  • Um auf Dateien auf den Server laden Sie Ihre Form enctype Attribut multipart/form-data einstellen:

    <form id="myForm" enctype="multipart/form-data">

  • Sie auch angeben müssen Ihre Datei input Tag als eine multiple file input Tag mit der multiple attribute. Sie scheinen dieses Recht zu haben, aber nur für den Fall versuchen:

    <input type="file" name="myFile" id="filesID" multiple="multiple" />

    statt.

Darüber hinaus gibt es (mindestens) ein paar Probleme in der for Schleife des Codes Javascript für die ausgewählten Dateien Handhabung; Sie verweisen input.length und input.input[i] wenn Sie input.files.length und input.files[i] statt Referenzierung werden sollten:

for (var i = 0; i < input.files.length; i++) { 
     var file = folder.createFile(input.files[i]);  
     file.setDescription("Uploaded by " + form.myName); 
} 

ich Ihnen dringend empfehlen mini tutorial on handling file uploads die super nützlich MDN des Check-Out für Details und Beispiele.

Auch, wenn Sie bereit sind, Bibliotheken und Plugins hinzuzufügen, ist bootstrap fileinput eine ziemlich nützliche, ziemlich einfach zu integrieren und auf jeder gewünschten Form zu verwenden.

In jedem Fall werden Sie mit einem Formular, um eine Reihe von Dateien am Ende Senden Sie auch auf dem Client als FileList auf dem files property des Eingangselementes gespeicherte Objekt zugreifen können File Objekte statt nur einer einzigen Datei Element enthält, .Wie im obigen Code gezeigt, können Sie auf jede Datei in diesem Objekt FileList als ein Array zugreifen (input.files[i]).

+0

aus irgendeinem Grund gibt mir das den Fehler "ReferenceError:" Dokument "ist nicht definiert" –

+0

Sie rufen eine Funktion auf, die den Verweis auf das aktuelle Dokument benötigt, bevor das Dokument geladen wird. Verwenden Sie chrome dev tools, um das Skript zu debuggen. Wenn Sie einen Backtrace von der Zeile ausführen, die Ihnen den Fehler anzeigt, werden Sie sehen, wo Sie den Aufruf tätigen, den Sie in einem 'document.addEventListener (" DOMContentLoaded ", Funktion (event) {}') platzieren sollten – NotGaeL

Verwandte Themen