投稿2024/04/02 02:55
GASを使ってGoogleドライブへのログイン不要ファイルアップローダー作りたいと考えています。
https://qiita.com/v2okimochi/items/06ed1ce7c56a877a1e10
上記ページを参考にしました。
現在関数が実行されなくて困っています。
①HTML
53行目：google.script.run.withSuccessHandler(updateView).processForm(formObject);
上記が実行されない
error
1appscriptの実行数からログを確認しましたが、 2dogetは実行されていますが、 3processForm(formObject)は実行されていないことを確認しています。 4
HTML
1<!DOCTYPE html> 2<html> 3 4 <body> 5 <div id="myform" style="text-align:center;"> 6 ファイルを選択してからアップロードしてください（10MBまで）<br><br> 7 <form> 8 <input id="file" name="myFile" type="file" onchange="changeSubmitButton()" /> 9 10 <button id="upload" type="button">Submit</button> 11 12 </form> 13 <label id="upload_label"></label> 14 </div> 15 16 17 <script> 18 function preventFormSubmit() { 19 var forms = document.querySelectorAll('form'); 20 for (var i = 0; i < forms.length; i++) { 21 forms[i].addEventListener('submit', function(event) { 22 event.preventDefault(); 23 }); 24 } 25 } 26 window.addEventListener('load', preventFormSubmit); 27 /*最初はアップロードボタンを押せないようにしておく*/ 28 document.addEventListener("DOMContentLoaded", function () { 29 document.getElementById("upload").disabled = true; 30 }, false); 31 /*制限サイズ以内のファイルが選択されたらアップロードボタンを押せるようにする*/ 32 function changeSubmitButton() { 33 const len=document.getElementById("file").files.length; 34 const size=document.getElementById("file").files[0].size; 35 const maxSize=1024 * 1024 * 10;//10MB 36 const uploadButton=document.getElementById("upload"); 37 if (len > 0 && size < maxSize) { 38 uploadButton.disabled = false; 39 } 40 else{ 41 uploadButton.disabled = true; 42 } 43 } 44 45 document.getElementById("upload").addEventListener('click', handleFormSubmit); 46 47 48 /*アップロードボタンが押されたらファイルをアップロード*/ 49 function handleFormSubmit(formObject) { 50 document.getElementById("upload").disabled = true; 51 const div1 = document.getElementById('upload_label').textContent = "uploading..."; 52 //アップロード成功した場合はupdateView()実行 53 google.script.run.withSuccessHandler(updateView).processForm(formObject); 54 } 55 /*アップロード完了画面に変える（動的）*/ 56 function updateView() { 57 var div1 = document.getElementById('upload_label').textContent = "uploaded"; 58 } 59 </script> 60 61 </body> 62 63</html> 64
javascript
1const folderID = "1****************************"; 2const SPREAD_ID = "1********************************"; 3const SPREAD = SpreadsheetApp.openById(SPREAD_ID); 4const sheetmeet = SPREAD.getSheetByName("シート1"); 5 6 7function doGet() { 8 return HtmlService.createHtmlOutputFromFile('index'); 9} 10 11function processForm(formObject) { 12 var formBlob = formObject.myFile; 13 14 var uploadFolder = DriveApp.getFolderById(folderID); 15 var driveFile = uploadFolder.createFile(formBlob);//アップロード 16 var file_url = driveFile.getUrl(); 17 18 return file_url; 19 20} 21
ファイルのアップロードボタンを複数設置する予定があるため、
onsubmitは使っていません。
https://qiita.com/v2okimochi/items/06ed1ce7c56a877a1e10
上記ページのように
特になし
回答1件
0
ベストアンサー
フォーム要素の取得、というかフォーム要素に限らず要素を取得する場合には、id または class があった方がいいです。
なくてもいいけど、あった方がいいです。
なので、まずは id をつけましょう。名前は何でもいいのですが、ここではform1にします。
html
1<form>
↓
html
1<form id="form1">
id を付けた要素は、document.getElementById()で取得できます。
js
1const formObject1 = document.getElementById('form1')
あとはこれを送信してみてください。
js
1google.script.run.withSuccessHandler(updateView).processForm(formObject1);
これで動作すると思います、たぶん。
投稿2024/04/02 06:17
総合スコア37437
あなたの回答
tips
プレビュー
Q&A
