事件发生时单击按钮如何将数据从模式对话框发送到侧边栏反之亦然? sidebar.htmlmodal.html编辑:

问题描述

我有一个带有简单表单的侧边栏,带有一个下拉菜单,用于选择条目的某些类别。旁边有一个按钮供用户添加新类别。此按钮显示一个模式对话框,在此对话框中有一个用户输入新类别名称的输入框和一个添加新”按钮,用于将新项目发送回侧边栏。我希望相应的下拉菜单将新类别包含在其选项中,并且其文本已经用新名称填充。

到目前为止我能想到的只是使用 localStorage 但我不知道如何在按下按钮和对话框时触发对侧边栏(或任何其他元素)下拉列表的更新关闭并提交新值。我一直在研究 thisthis,但我无法真正让它适用于我的情况。

我压制了 Code.gs 部分,因为它们运行良好且不相关。

sidebar.html

<script>
  document.getElementById("btn-add-category").addEventListener("click",goToAddNewItem);

  function goToAddNewItem(){
    google.script.run.loadNewItemForm();
  }
      
  (async () => {
    //After modal dialog has finished,receiver will be resolved
    let receiver = new Promise((res,rej) => {
    window.modalDone = res;
    });
    var message = await receiver;
    
    document.getElementById("category-sidebar").value = message
  })();
</script>

modal.html

这是模态对话框的 html 文件

<body>
  <div class="form-group" id="input-category">
    <label for="category">Category:</label>
    <div class="input-group input-line">
      <input type="text" class="form-control form-control-sm" id="category">
    </div>
  </div>
  <div class="form-group">
    <button id="btn-add-new" class="btn btn-dark btn-sm">Add New</button>
  </div>

  <script>

    function findSideBar(limit) {
      let f = window.top.frames;

      for (let i = 0; i < limit; ++i) {
        try {
          if (
            f[i] /*/iframedAppPanel*/ &&
            f[i].length &&
            f[i][0] && //#sandBoxFrame
            f[i][0][0] && //#userHtmlFrame
            window !== f[i][0][0] //!== self
          ) {
            console.info('Sidebar found ');
            var sidebar = f[i][0][0];
            sidebar.modalDone(document.getElementById("category").value);
          }
        } catch (e) {
          console.error(e);
          continue;
        }
      }
    };

    function afteraddNewClicked(){
      findSideBar(10);
      google.script.host.close();
    }

    document.getElementById("btn-add-new").addEventListener("click",afteraddNewClicked);

  </script>
</body>

编辑:

modal.html 现在具有函数 findSidebar

解决方法

sidebar.modalDone = document.getElementById("category").value      

resmodalDone 需要被调用。仅仅分配一个值是行不通的。试试

sidebar.modalDone(document.getElementById("category").value);