2017-08-16 105 views
0

我正在創建container-bound綁定到Google電子表格的Google Apps腳本。在我的GS代碼中,我使用Google HTML Service在Google表格中顯示對話框(即HTML表單)。Google Apps腳本 - HTML服務 - 用於客戶端表單提交的「等待」

我遇到的問題是,當我呈現HTML表單客戶端時,GS服務器端代碼繼續運行。相反,我想「暫停」服務器端代碼,並等待用戶提交表單。

這可能嗎?

這是我到目前爲止有:

Code.gs

function onOpen(e) { 
    var ui = SpreadsheetApp.getUi(); 
    ui.createMenu('Custom') 
     .addItem('Generate Shipping Email', 'menuItem1') 
     .addToUi(); 
} 

function menuItem1() { 
    var html = HtmlService.createHtmlOutputFromFile('index'); 
    var ui = SpreadsheetApp.getUi() 
    ui.showModalDialog(html, 'Shipping Email Options'); // This line shows the modal in index.html 

    // Here is where I would like to "pause" until the HTML form is submitted by user clicking the button with id="button1id" ... 

    Logger.log("Line after showModalDialog"); // ... however, currently this code runs before the user clicks submit or cancel button in the html form 
    // Rest of code which should not run until user clicks submit or cancel button will go here 
} 

readyToSendEmail(shippingNeeded, notes) { 
    // Some non-relevant code goes here 
} 

的index.html

<!DOCTYPE html> 
<html> 
    <head> 
    <base target="_top"> 
    </head> 
    <body> 
    <form class="form-horizontal"> 
    <fieldset> 

    <!-- Form Name --> 


    <!-- Multiple Radios (inline) --> 
    <div class="form-group"> 
    <label class="col-md-4 control-label" for="radios">Do you need expedited shipping?</label> 
    <div class="col-md-4"> 
    <label class="radio-inline" for="radios-0"> 
    <input type="radio" name="radios" id="shippingNeededYes" value="Yes" checked="checked"> 
    Yes 
    </label> 
    <label class="radio-inline" for="radios-1"> 
    <input type="radio" name="radios" id="shippingNeededNo" value="No"> 
    No 
    </label> 
    </div> 
    </div> 

    <!-- Textarea --> 
    <div class="form-group"> 
    <label class="col-md-4 control-label" for="textarea">Additional shipping notes:</label> 
    <div class="col-md-4">      
    <textarea class="form-control" id="textarea" name="textarea"></textarea> 
    </div> 
    </div> 

    <!-- Button (Double) --> 
    <div class="form-group"> 
    <label class="col-md-4 control-label" for="button1id">Ready to send?</label> 
    <div class="col-md-8"> 
    <button id="button1id" name="button1id" class="btn btn-primary" onclick="clickedSubmit()">Yes, send the email</button> 
    <button id="button2id" name="button2id" class="btn btn-default" onclick="google.script.host.close()">Cancel, do not send an email</button> 
    </div> 
    </div> 

    </fieldset> 
    </form> 

    <script> 
    function clickedSubmit() { 
    if(document.getElementById('shippingNeededYes').checked) { 
     var shippingNeeded = "Yes"; 
    } else { 
     var shippingNeeded = "No"; 
    } 
    var notes = document.getElementById('textarea'); 
    google.script.run.readyToSendEmail(shippingNeeded, notes); 
    } 
    </script> 

    </body> 
</html> 

任何想法,想法或建議表示讚賞!

+0

當有人點擊Generate Shipping Email菜單時,總是會運行'menuItem1'函數...如果你想在用戶提交之後運行該代碼段,將該塊移動到'readyToSendEmail'函數 – Ritz

+0

@Ritz其實沒什麼。爲了澄清,我想要做的就是獲取它,以便Logger.log(「ShowModalDialog後面的行」);'直到在index.html中的表單被提交後才運行,讓用戶單擊'id =「button1d」' – Adam

+0

''Logger.log(「Line after showModalDialog」);'將在用戶選擇菜單後立即運行生成郵件 – Ritz

回答

0

我想你有點困惑js函數如何在應用程序腳本中工作。

//This function will run when the spreadsheet is loaded 
     function onOpen(e) { 
      var ui = SpreadsheetApp.getUi(); 
      ui.createMenu('Custom') 
       .addItem('Generate Shipping Email', 'menuItem1') 
       .addToUi(); 
     } 

    //This entire function will run when you click on the menu item in the spreadsheet. 
     function menuItem1() { 
      var html = HtmlService.createHtmlOutputFromFile('index'); 
      var ui = SpreadsheetApp.getUi() 
      ui.showModalDialog(html, 'Shipping Email Options'); 
     } 


    //This is where you need to write the logic...this function will be called when you click on the button 
     function readyToSendEmail(shippingNeeded, notes) { 

     } 

而且,它能夠更好地增加type="button"這兩個按鈕,否則它可以把它當作提交按鈕。

相關問題