Google Apps腳本：自定義輸入驗證處理程序和POST請求

Question

當前我正在使用提交按鈕以及一些窗口小部件和關聯的客戶端/服務器處理程序。點擊提交按鈕後，數據將使用發佈請求發送。

現在我想要做上述所有，但以不同的方式。

首先，我不希望客戶機/服務器處理，對少數部件這些都是很好的，但對於許多小部件這些都是令人困惑。

現在我只想寫一個驗證處理程序，應該在提交按鈕點擊被調用，處理程序應該在Widget中，如果一切都很好的輸入值發送的數據顯示其他錯誤警告。

，我們可以創建和發送自定義POST請求，而不是使用提交按鈕的？

我使用了UiApp我的web應用程序。

如何實現這一目標？誰能幫我？

Answer 1

你，如果你使用了UiApp或HTML服務沒有精確。

在了UiApp這裏是我可以建議你：
您可以添加到您的元素ClientHandler的，如果數據是正確的，直接檢查（如果所有的數據都是正確的，那麼你可以顯示一個提交按鈕） 爲例：

function doGet(){ 
    var app = UiApp.createApplication(); 
    var email = app.createTextBox().setId("text").setName("text").setValue("enter a vaild email"); 
    var field1 = app.createTextBox().setId("notNum").setName("notNum"); 
    var submitButt = app.createButton("submit").setEnabled(false); 

    var emailhandler1 = app.createClientHandler().validateEmail(email).forEventSource().setStyleAttribute("color", "green"); 
    var emailhandler2 = app.createClientHandler().validateNotEmail(email).forEventSource().setStyleAttribute("color", "red").forTargets(submitButt).setEnabled(false); 
    var fieldhandler1 = app.createClientHandler().validateNotLength(field1, 1, 100).forTargets(submitButt).setEnabled(false); 
    var fieldhandler2 = app.createClientHandler().validateInteger(field1).forTargets(submitButt).setEnabled(false); 
    var finalhandler = app.createClientHandler().forTargets(submitButt).validateLength(field1, 1, 100).validateNotNumber(field1).validateEmail(email).setEnabled(true); 

    email.addChangeHandler(emailhandler1).addChangeHandler(emailhandler2).addChangeHandler(finalhandler); 
    field1.addChangeHandler(fieldhandler1).addChangeHandler(fieldhandler2).addChangeHandler(finalhandler); 
    app.add(app.createLabel("email: ")).add(email).add(app.createLabel("text (no number)")).add(field1).add(submitButt); 
    return(app); 
} 

您還可以使用一臺服務器處理程序來檢查所有的數據，最後顯示的提交按鈕：

function doGet(){ 
    var app = UiApp.createApplication(); 
    var panel = app.createVerticalPanel(); 
    var formPanel = app.createFormPanel().add(panel); 

    var email = app.createTextBox().setId("email").setName("email").setValue("enter a vaild email"); 
    var field1 = app.createTextBox().setId("notNum").setName("notNum"); 
    var validateButt = app.createButton("validate data").setId("validateButton"); 
    var submitButt = app.createButton("submit").setId("submit").setVisible(false); 

    validateButt.addClickHandler(app.createServerHandler("checkdata").addCallbackElement(formPanel)); 

    panel.add(app.createLabel("email: ")).add(email).add(app.createLabel("text (no number)")).add(field1).add(validateButt).add(submitButt); 
    app.add(formPanel); 
    return(app); 
} 

function checkdata(e){ 
    var app = UiApp.getActiveApplication(); 
    var pattEmail = new RegExp(/([\w-\.]+)@((?:[\w]+\.)+)([a-zA-Z]{2,4})/); 
    var pattTxt = new RegExp(/[^0-9]+/); 
    Logger.log("email: "+e.parameter.email+" text: "+e.parameter.notNum); 
    if(pattEmail.test(e.parameter.email) && pattTxt.test(e.parameter.notNum)){ 
    app.getElementById("validateButton").setVisible(false); 
    app.getElementById("submit").setVisible(true); 
    } 
    else{ 
    Logger.log("not valid"); 
    } 
    return(app); 
} 

但（在我看來）的最佳方法是使用HTML服務（因爲它不是在開發模式了）：

腳本文件：

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

HTML文件： MA1更新

一個變種後

<div> 
<form> 
email:<br> 
<input type="text"/ id="email" name="email" onchange="checkEmail();"><br> 
text:<br> 
<input type="text"/><br> 
<input type="submit" value="submit"/> 
</form> 
</div> 
<script> 
function checkEmail(){ 
    var email = document.getElementById("email").value; 
    var pattEmail = new RegExp(/([\w-\.]+)@((?:[\w]+\.)+)([a-zA-Z]{2,4})/); 
    if(pattEmail.test(email)){ 
    document.getElementById("email").style.color = "green"; 
    } 
} 
</script> 

編輯第二個選項：與提交按鈕關聯一個完成所有工作的服務器處理程序。 如果數據正確，它們將被處理。 如果不是，則會向用戶顯示警告。

演示：

function doGet(){ 
    var app = UiApp.createApplication(); 
    var panel = app.createVerticalPanel().setId("panel"); 
    var formPanel = app.createFormPanel().add(panel); 
    var email = app.createTextBox().setId("email").setName("email").setValue("enter a vaild email"); 
    var validateButt = app.createButton("submit").setId("validateButton"); 
    validateButt.addClickHandler(app.createServerHandler("checkAndValData").addCallbackElement(formPanel)); 
    panel.add(app.createLabel("email: ")).add(email).add(validateButt); 
    app.add(formPanel); 
    return(app); 
} 

function checkAndValData(e){ 
    var app = UiApp.getActiveApplication(); 
    var pattEmail = new RegExp(/([\w-\.]+)@((?:[\w]+\.)+)([a-zA-Z]{2,4})/); 
    if(!pattEmail.test(e.parameter.email)){ 
    app.getElementById("email").setStyleAttribute("color", "red") 
    return(app); 
    } 
    else{ 
    Logger.log("Do something with the data"); 
    app.getElementById("panel").add(app.createLabel("your data are are processed")); 
    return(app); 
    } 
}