Question

队

我无法使用服务器端脚本更新HTML页面上的文本框。有一个服务器端代码和一个HTML页面 - 使用Googl App Script构建。

server.gs

function doGet(e)
{
var form =      HtmlService.createTemplateFromFile('form.html');   
form.listId = "categories";   form.datalist = ["Category 1", "Category 2", "Category 3"];   
return form.evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME); 
}

function updatescreen(form)
{
try
{
      if (form.listId == "Category 1") 
      {
          form.myExpense = 2000;
          Logger.clear();
          Logger.log("2000");
          return; 
      }
      if (form.listId == "Category 2") 
      {
          form.myExpense = 3000;
          Logger.clear();
          Logger.log("3000");
          return; 
      }

      //form.myExpense = 4000;
      Logger.clear();
      Logger.log("4000");
      return;   
}   
catch (error)   
   {
      return error.toString();
   }
 }

form.html

<form id="myForm">
      <input type="text" id="myExpense" placeholder=1000>
      <input list="<?= listId ?>" name="<?= listId ?>"
          onclick = google.script.run.withSuccessHandler(screenupdated)
              .updatescreen(this.parentNode);
              return true;>
          <datalist id="<?= listId ?>">
                <? for (var i=0; i<datalist.length; i++) { ?>
                  <option value="<?= datalist[i] ?>">
                <? } ?>
          </datalist> 

      <input type="submit" name = "refresh" value="Update Screen" 
             onclick="this.value='Updating Screen ...';
                      google.script.run.withSuccessHandler(screenupdated)
                      .updatescreen(this.parentNode);
                      return false;"> </form> <div id="output"></div>

<script>
    function screenupdated(status) 
    {
        document.getElementById('myForm').refresh.value = "Update Screen";
        document.getElementById('myForm').show();
        document.getElementById('output').innerHTML = status;
    }
</script>

<style>  
      input { display:block; margin: 20px; } 
</style>

我的问题如下：

在选择名为“listID”的下拉列表时尝试添加操作时，onclick函数没有将控件定向到脚本“updatescreen”;我试图根据列表框“listID”中的选择更新文本框“myExpense”。文本框“myExpense”未获得更新
我尝试使用按钮更新屏幕 - 但它仍无法正常工作。当我尝试添加一个记录器来查看控件是否被传递给服务器端观察者时出现奇怪的行为 - 当行form.myExpense = 4000;到达 - 它甚至不更新日志。当该行被注释时 - 记录器工作。

任何想法 - 如何处理这个问题？

感谢您的帮助。

侯赛因。

Answer 1

队

我想出来了。服务器端无法直接更新文本框。它只能将返回值传递给successhandler和successhandler，然后才能更新该字段。

修订后的代码如下：

server.gs

function doGet(e)
{
  var form =  HtmlService.createTemplateFromFile('form.html');
  form.listId = "categories";
  form.datalist = ["Category 1", "Category 2", "Category 3"];
  return form.evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME);
}

function updatescreen(form)
{
  try
  {
      var returnvalue = 0;

      if (form.listId == "Category 1")
      {
          returnvalue = 2000;
          Logger.clear();
          Logger.log("2000");
          return;
      }
      if (form.listId == "Category 2")
      {
          returnvalue = 3000;
          Logger.clear();
          Logger.log("3000");
          return;
      }

      return returnvalue;
  }
  catch (error)
  {
       return error.toString();
  }
}

form.html

<form id="myForm">
      <input type="text" name="myExpense" placeholder=1000>
      <input list="<?= listId ?>" name="<?= listId ?>"
          onclick = google.script.run.withSuccessHandler(screenupdated)
              .updatescreen(this.parentNode);
              return true;>
          <datalist id="<?= listId ?>">
                <? for (var i=0; i<datalist.length; i++) { ?>
                  <option value="<?= datalist[i] ?>">
                <? } ?>
          </datalist>

      <input type="submit" name = "refresh" value="Update Screen"
             onclick="this.value='Updating Screen ...';
                      google.script.run.withSuccessHandler(screenupdated)
                      .updatescreen(this.parentNode);
                      return false;">




<script>
    function screenupdated(status)
    {
        document.getElementById('myForm').refresh.value = "Update Screen";
        document.getElementById('myForm').myExpense.value = status;
    }
</script>

<style>
 input { display:block; margin: 20px; }
</style>

谢谢大家。

侯赛因。

无法使用服务器端脚本更新HTML页面上的文本框

1 个答案: