这些脚本在首次加载时起作用。但是,当我在下拉菜单中选择时,页面将根据我选择的内容重新加载表中的新数据,这是当我单击一行时无法收集数据的时间。请参见下面的代码:


  代码


function doGet()
{
  var html=HtmlService.createTemplateFromFile('index');
  return html.evaluate();
}

function getSelect() {
  var list = SpreadsheetApp.openById('spreadssheetID').getSheetByName("VL Slots").getDataRange().getValues();
  var lane = 1;
  var select="";
  for (var l = 3; l < list.length; l++) {
    select+='<option value="' + list[l][lane] + '">'+ list[l][lane] + ' </option>';
  }
  return select;
}
function getTable(lob) {
  var data = SpreadsheetApp.openById('spreadssheetID').getSheetByName("VL Request").getDataRange().getValues();
  var rid = 0;
  var request = 1;
  var table="";
  table+='<tr>';
  for (var i = 1; i < data.length; i++) {
    if (data[i][rid] == lob) {
      table+='<td>' + data[i][request] + '</td>';
    }
  }
  table+='</tr>';
  return  table;
}



  index.html


<!DOCTYPE html>
    <html>
      <head>
        <base target="_top">
      </head>
      <script>
      function populateSelect(){
        google.script.run.withSuccessHandler(onSuccess).getSelect();
       }
      function onSuccess(select){
        document.getElementById("mySelect").innerHTML=select;
      }
      function polling(){
        setInterval(myFunction,2000);
       }
      function myFunction(){
        var lob = document.getElementById("mySelect").value;
        google.script.run.withSuccessHandler(onSuccess2).getTable(lob);

      }
      function onSuccess2(table){
        document.getElementById("myTable").innerHTML=table;
      }
      </script>
      <body onload="populateSelect()">
        <select id="mySelect" onchange="polling()">
        </select>
        <table id="myTable">
        </table>
<form id="logForm">
<label>Request <span class="required">*</span></label><input type="text" id="request" name="request" class="field-long" placeholder="Request" readonly />
</form>

<script>

                var table = document.getElementById('myTable');

                for(var i = 1; i < table.rows.length; i++)
                {
                    table.rows[i].onclick = function()
                    {
                         //rIndex = this.rowIndex;
             document.getElementById("request").value = this.cells[0].innerHTML.trim();

                    };
                }

         </script>

      </body>
    </html>


我想做的是,我可以在下拉列表中进行选择,然后根据所选内容将数据收集到表中,然后单击行以在表格中传递信息。

最佳答案

如果我理解正确,那么您的目标是单击通过轮询从电子表格中检索到的值,并将此值设置为输入字段“ request”的内容。
在这种情况下,您应该将您的请求合并到onSuccess2函数中,这样在表中填充了电子表格中的内容后就会发生
请记住,由于您仅从工作表中检索一个值,因此无需遍历行
修改代码的html部分,如下所示:


<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <script>
  function populateSelect(){
    google.script.run.withSuccessHandler(onSuccess).getSelect();
   }
  function onSuccess(select){
    document.getElementById("mySelect").innerHTML=select;
  }
  function polling(){
    setInterval(myFunction,2000);
   }
  function myFunction(){
    var lob = document.getElementById("mySelect").value;
    google.script.run.withSuccessHandler(onSuccess2).getTable(lob);
  }
  function onSuccess2(table){
    document.getElementById("myTable").innerHTML=table;
    var myTable = document.getElementById('myTable');
    var row = myTable.getElementsByTagName("tr")[0];
    var cell = row.getElementsByTagName("td")[0];
    var request= cell.innerHTML;
    row.onclick = createClickHandler(request);
  }
  var createClickHandler = function(request) {
    return function(){
      document.getElementById("request").value = request;
    };
  }
  </script>
  <body onload="populateSelect()">
    <select id="mySelect" onchange="polling()">
    </select>
    <table id="myTable">
    </table>
    <form id="logForm">
      <label>Request <span class="required">*</span></label><input type="text" id="request" name="request" class="field-long" placeholder="Request" readonly  />
    </form>
  </body>
</html>

关于javascript - 脚本冲突,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/58521387/

10-11 22:15
查看更多