通過Apps腳本提交驗證

我需要幫助。我有這個post相同的需要。我遵循指示，但我找不到我的錯誤。我很沮喪。通過Apps腳本提交驗證

當我使用空字段提交時，腳本向我顯示一個空白頁。
當我提交完整的字段時，腳本也顯示我一個空白頁面，並且永遠不會上傳文件。

這是我的最終代碼：

code.gs

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

function uploadFiles(form) { 

    try { 

    var dropbox = "NHD Papers"; 
    var folder, folders = DriveApp.getFoldersByName(dropbox); 

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

    var blob = form.myFile;  
    var file = folder.createFile(blob);  
    file.setDescription("Uploaded by " + form.myName + ", Division: " + form.myDivision + ", School: " + form.mySchool + ", State: " + form.myState); 

    return "<h2>File uploaded successfully!</h2><p>Copy and paste the following URL into registration:<br /><br /><strong>" + file.getUrl() + '</strong></p>'; 

    } catch (error) { 

    return error.toString(); 
    } 

}

form.html

<p> 
<form id="myForm" onsubmit="validateForm();"> 
    <h1>NHD Paper Upload</h1> 

    <label>Name</label> 
    <input type="text" name="myName" class="required" placeholder="Enter your full name.."> 
    <label>Division</label> 
    <input type="text" name="myDivision" class="required" placeholder="(ex. Junior or Senior)"> 
    <label>School</label> 
    <input type="text" name="mySchool" class="required" placeholder="Enter your school.."> 
    <label>Affiliate</label> 
    <input type="text" name="myAffiliate" class="required" placeholder="Enter your affiliate.."> 
    <label>Select file to upload. </label> 
    <input type="file" name="myFile"> 
    <input type="submit" value="Submit File" > 
    <br /> 

</form> 
</p> 

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

<script> 
    function validateForm() { 
     var x=document.getElementsByClassName('required'); 
     for(var i = 0; i <x.length; i++){ 
     if (x[i].value == null || x[i].value == "") 
     { 
     alert("All fields must be filled out."); 
     return false; 
     } 
     this.value='Please be patient while your paper is uploading..'; 
     var myFormObject = document.getElementById('myForm'); 
     google.script.run.withSuccessHandler(fileUploaded) 
     .uploadFiles(myFormObject); 
     } 
    } 
    function fileUploaded(status) { 
     document.getElementById('myForm').style.display = 'none'; 
     document.getElementById('output').innerHTML = status; 
    } 

</script> 

<style> 
input { display:block; margin: 15px; } 
p {margin-left:20px;} 
</style>

問候，

來源

2016-10-10 user2946433

在IFRAME模式HTML表單被允許提交，但如果表格沒有action屬性它將提交到一個空白頁面。

由official documentation提出的解決方案是添加下面的JavaScript代碼，以防止對負載的所有形式submitions：

<script> 
    // Prevent forms from submitting. 
    function preventFormSubmit() { 
    var forms = document.querySelectorAll('form'); 
    for (var i = 0; i < forms.length; i++) { 
     forms[i].addEventListener('submit', function(event) { 
     event.preventDefault(); 
     }); 
    } 
    } 
    window.addEventListener('load', preventFormSubmit); 
</script>

你也可以在你的validateForm()函數的末尾添加return false;或event.preventDefault()。

來源

2016-10-13 18:06:53 ocordova

通過Apps腳本提交驗證

回答

相關問題