我试图让这个表显示每个表行的选项,但我不能完全理解:

我想我会把它设定在第for loop秒,但我刚到html,不能前进.

<script>
    //PREVENT FORMS FROM SUBMITTING / PREVENT DEFAULT BEHAVIOUR
          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, true); 
              
           
          //HANDLE FORM SUBMISSION
          function handleFormSubmit(formObject) {
            google.script.run.withSuccessHandler(createTable).processForm(formObject);
            //document.getElementById("search-form").reset();
          }
         
          //CREATE THE DATA TABLE
          function createTable(dataArray) {
            if(dataArray && dataArray !== undefined && dataArray.length != 0){
              var result = "<table class='table table-sm table-striped' id='dtable' style='font-size:0.8em'>"+
                           "<thead style='white-space: nowrap'>"+
                             "<tr>"+                               //Change table headings to match witht he Google Sheet
                              "<th scope='col'>Client</th>"+
                              "<th scope='col'>Name</th>"+
                              "<th scope='col'>Date</th>"+
                              "<th scope='col'>Approval</th>"+
                            "</tr>"+
                          "</thead>";
              for(var i=0; i<dataArray.length; i++) {
                  result += "<tr>";
                  for(var j=0; j<dataArray[i].length; j++){
                      result += "<td>"+dataArray[i][j]+"</td>";
                  }
                  result += "</tr>";
              }
              result += "</table>";
              var div = document.getElementById('search-results');
              div.innerHTML = result;
            }else{
              var div = document.getElementById('search-results');
              //div.empty()
              div.innerHTML = "Data not found!";
            }
          }
  </script>

This is the file's

This is the Web App URL

Here's the current result: enter image description here

推荐答案

我相信你的目标如下.

  • 您想将下拉列表放在"批准"列中.

在这种情况下,下面的修改如何?

修改脚本:

请按如下方式修改函数createTable.

function createTable(dataArray) {
  if (dataArray && dataArray !== undefined && dataArray.length != 0) {
    var option = "<select name='D1'>" +
      "<option value='volvo'>Volvo</option>" +
      "<option value='saab'>Saab</option>" +
      "<option value='mercedes'>Mercedes</option>" +
      "<option value='audi'>Audi</option>" +
      "</select>";
    var result = "<table class='table table-sm table-striped' id='dtable' style='font-size:0.8em'>" +
      "<thead style='white-space: nowrap'>" +
      "<tr>" +                               //Change table headings to match witht he Google Sheet
      "<th scope='col'>Client</th>" +
      "<th scope='col'>Name</th>" +
      "<th scope='col'>Date</th>" +
      "<th scope='col'>Approval</th>" +
      "<td>" +
      "</td>" +
      "</tr>" +
      "</thead>";
    for (var i = 0; i < dataArray.length; i++) {
      result += "<tr>";
      for (var j = 0; j < dataArray[i].length; j++) {
        result += "<td>" + dataArray[i][j] + "</td>";
      }
      result += "<td>" + option + "</td>";
      result += "</tr>";
    }
    result += "</table>";
    var div = document.getElementById('search-results');
    div.innerHTML = result;
  } else {
    var div = document.getElementById('search-results');
    //div.empty()
    div.innerHTML = "Data not found!";
  }
}
  • option来自你的上一个问题.Ref

Javascript相关问答推荐

切换时排序对象数组,切换不起作用

为什么!逗号和空格不会作为输出返回,如果它在参数上?

从Node JS将对象数组中的数据插入Postgres表

在带有背景图像和圆形的div中添加长方体阴影时的重影线

将对象推送到数组会导致复制

有没有办法通过使用不同数组中的值进行排序

MongoDB通过数字或字符串过滤列表

重新渲染过多(&Q).REACT限制渲染次数以防止无限循环.使用REACT下拉菜单时

限制数组中每个元素的长度,

如何在不将整个文件加载到内存的情况下,在Node.js中实现Unix粘贴命令?

Rails 7:在不使用导入映射的情况下导入Java脚本

如果我将高度设置为其内容的100%,则在Java脚本中拖动以调整面板大小时会冻结

打字脚本中的函数包装键入

如何将PNG图像放在wix站点的Open Streemap map 上,使PNG图像成为 map 不可分割的一部分?

使用Firebase实时数据库`update`在同一 node 上执行多个更新

JS:以特定格式显示不同时区

JS日期构造函数与future 日期不一致

我不能在ANGLE项目中使用addEventListner添加方法

promise 封装未知数量的异步工作(即其他promise )

如何在一个又一个promise 得到解决的情况下才解除一个promise 呢?