HTML form file upload to Google Drive and save URL to google sheet -


i'm new world of google scripting, , have found great tutorials on how either: upload file google drive html form ii append new rows google sheet.

essentially trying to write basic html form collects few text fields , file attachment, file attachment uploaded google drive , url along other form text fields appended google sheet.

here html form working (based on tutorial found):

<!-- include google css package --> <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons.css">  <!-- can include own css styles --> <style>   form { margin: 40px auto; }   input { display:inline-block; margin: 20px; } </style>  <script>    // function called after form submitted   function uploadfile() {     document.getelementbyid('uploadfile').value = "uploading file..";     google.script.run        .withsuccesshandler(fileuploaded)        .uploadfiles(document.getelementbyid("labnol"));     return false;   }    // function called after google script has executed   function fileuploaded(status) {     document.getelementbyid('labnol').style.display = 'none';     document.getelementbyid('output').innerhtml = status;   }  </script>  <!-- html form --> <form id="labnol">    <!-- text input fields -->   <input type="text" id="namefield" name="myname" placeholder="your name..">   <input type="email" id="emailfield" name="myemail" placeholder="your email..">    <!-- file input filed -->   <input type="file" name="myfile">    <!-- submit button. calls server side function uploadfiles() on click -->   <input type="submit" id="uploadfile" value="upload file"          onclick="this.value='uploading..';uploadfile();">  </form>  <!-- here results of form submission displayed --> <div id="output"></div> 

and here google script (again, based on useful tutorial on blog)

/* script deployed web app , renders form */ function doget(e) {   return htmlservice.createhtmloutputfromfile('form.html')             .setsandboxmode(htmlservice.sandboxmode.native);   // important file upload fail in iframe sandbox mode. }  /* function process submitted form */ function uploadfiles(form) {    try {      /* name of drive folder files should saved */     var dropbox = "test form submissions";     var folder, folders = driveapp.getfoldersbyname(dropbox);      /* find folder, create if folder not exist */     if (folders.hasnext()) {       folder = folders.next();     } else {       folder = driveapp.createfolder(dropbox);     }       /* file uploaded though form blob */     var blob = form.myfile;     var file = folder.createfile(blob);      //allocate variables submissions in sheet     var namerecord = form.myname;     var emailrecord = form.myemail;      /* set file description name of uploader */     file.setdescription("uploaded " + form.myname);      /* return download url of file once on google drive */     return "file uploaded " + file.geturl();      var uploadurl = file.geturl();     //    } catch (error) {      /* if there's error, show error message */     return error.tostring();   }          //open spreadsheet based on url   var googsheet = spreadsheetapp.openbyurl('https://docs.google.com/spreadsheets/d/17fuu1vuuxgcgs1tpsgpwdnxmhx3aefscmjx156hq5_u/edit?usp=sharing');   logger.log(googsheet.getname());    var sheet = googsheet.getsheets()[0];   sheet.appendrow(["james", "jim", "abc"]);    } 

my intuition slip lines of code in add form data specified sheet it's not working , must doing wrong :s

any advice appreciated ignorant business analyst new web programming :/

thanks

i had same problem, , link solved issue :

this update google script example upload file google sheets , macros.

  1. in line in html defining submit button, change id="uploadfile" id="uploadfilebutton" (there possibly collision between id of submit button , function uploadfile())

  2. and change onclick trigger adding return false: onclick="this.value='uploading..';uploadfile();return false;"

  3. correspondingly, in code defining uploadfile() function, change

    document.getelementbyid('uploadfile').value = "uploading file.."; 

    to

    document.getelementbyid('uploadfilebutton').value = "uploading file.."; 

a complete thread link: https://code.google.com/p/google-apps-script-issues/issues/detail?id=6177

regards venezuela

note: sorry bad english


Comments

Popular posts from this blog

wordpress - (T_ENDFOREACH) php error -

Export Excel workseet into txt file using vba - (text and numbers with formulas) -

Using django-mptt to get only the categories that have items -