0

I am creating an online HTML form that gives people the option to upload a file. I am using google sheets to collect the data so I am using their google scripts feature. When I run my code everything works, meaning I get data inserted into cells, but not the file upload. Here is my Google Scripts code for the file upload:

function doGet(request) {
  return HtmlService.createTemplateFromFile('Index')
      .evaluate();
}

/* @Include JavaScript and CSS Files */
function include(filename) {
  return HtmlService.createHtmlOutputFromFile(filename)
      .getContent();
}

function uploadFiles(data){
  var folder = DriveApp.getFolderById('1pp1ELzGa2fZqU4IHAasZMHsmYx19pnYv');
  var createFile = folder.createFile(data.image);
  return createFile.getUrl();
}

From what I can tell the problem is at the data.image. This is where I am trying to retrieve my image so I can upload it into the folder. It must be that uploadFiles(data) is not properly bringing in data.

Here is the HTML and JavaScript:

<form id="myForm" onsubmit="handleFormSubmit(this)">
        <h1 class="h4 mb-4 text-center" style="text-align:center"> <center>File Upload Testing</center></h1>
        
        <table>
          <tr>
            <td colspan="11"><input type="file" id="image"></td>
          </tr>
          <input type="hidden" id="fileURL" name="fileURL">
        </table>
        <button type="submit" class="button button1" id="submitBtn">Submit</button>
      </form>
      <script>          
        document.getElementById('submitBtn').addEventListener('click', 
          function(e){
            google.script.run.withSuccessHandler(onSuccess).uploadFiles(this.parentNode);;}
        )

        function onSuccess(data){
          document.getElementById("fileURL").value = data;
        }
      </script>

I have a feeling that the e parameter is not retrieving the data above, however I don't really understand how it works. It could also be this.parentNode that's not grabbing the fike.

I am using the onSuccess function to retrieve the link so I can put it into my google sheet for quick access.

This is the error I receive; enter image description here

Here is a link to the google sheet. To reach google scripts go to 'Tools -> Script Editor'. https://docs.google.com/spreadsheets/d/16w8uB4OZHCeD7cvlrUv5GHP72CWxQhO1AAkF9MMSpoE/edit?usp=sharing

Here is another technique I attempted to use: Javascript:

function uploadthis(fileForm){
          const file = fileForm.image.files[0];
          const fr = new FileReader();
          fr.onload = function(e) {
            const obj = {
              // filename: file.name
              mimeType: file.type,
              bytes: [...new Int8Array(e.target.result)]
            };
            google.script.run.withSuccessHandler((e) => console.log(e)).uploadFiles(obj);
          };
          fr.readAsArrayBuffer(file);
          }

Google Script:

function uploadFiles(data){  
  var file = Utilities.newBlob(data.bytes, data.mimeType);  // Modified
  var folder = DriveApp.getFolderById('1pp1ELzGa2fZqU4IHAasZMHsmYx19pnYv');
  var createFile = folder.createFile(file);
  return createFile.getId();  // Added
}

Thank you!

Ramy CoreMT
  • 73
  • 1
  • 7
  • I think that [this thread](https://stackoverflow.com/q/60742695) will be the answer for your question. – Tanaike Feb 13 '21 at 00:30
  • @Tanaike I attempted their solution however it still did not work. I did modify the code to make it allign more with what I need. I placed my attempt of that code at the very end of my question. Thank you! – Ramy CoreMT Feb 17 '21 at 13:08
  • Thank you for replying. I apologize for the inconvenience and my poor English skill. Unfortunately, I cannot understand about your current issue from `however it still did not work`. This is due to my poor English skill. I deeply apologize for this again. In order to correctly understand about your current issue, can you provide the detail of `however it still did not work`? By this, I would like to confirm it. – Tanaike Feb 17 '21 at 13:13
  • @Tanaike No worries; when I go to upload a file, the file does not arrive to its destination in my google drive – Ramy CoreMT Feb 17 '21 at 14:45
  • Thank you for replying. I apologize for the inconvenience. Unfortunately, I cannot replicate your situation. This is due to my poor skill. I deeply apologize for this. In order to correctly understand about your current issue, can you provide your current whole script for replicating your issue? By this, I would like to confirm it. If you can cooperate to resolve your issue, I'm glad. Can you cooperate to resolve it? – Tanaike Feb 18 '21 at 00:42

0 Answers0