如何隐藏应用程序脚本的可视化表以传播工作表谷歌应用程序脚本代码

时间:2017-07-14 10:07:50

标签: javascript google-apps-script

我有HTML网络应用,我已将电子表格转换为HTML表格。现在我想将此HTML表格转换为电子表格。是否可以将其转换回电子表格?

您可以说我可以直接使用电子表格,但问题是我应用了一些过滤器。现在每当我将过滤器应用于特定列时,它都会显示,所以现在我希望使用谷歌应用脚​​本将列移动到新的电子表格

以下是我的表格,如何使用Google App Script将此表格转换为电子表格

My Table Image Please go through

1 个答案:

答案 0 :(得分:0)

我在本例中使用两张纸,一张名为sht2tbl,另一张名为tbl2sht。运行代码时,您需要准备好两者。

这里有sheet2table和table2sheet.gs:

function sheetToTable()//This produces a modeless dialog
{
  var s='';
  s+='<table width="100%">';
  var ss=SpreadsheetApp.getActiveSpreadsheet();
  var sht=ss.getSheetByName('sht2tbl');
  var rng=sht.getDataRange();
  var rngA=rng.getValues();
  for(var i=0;i<rngA.length;i++)
  {
    s+='<tr>';
    for(var j=0;j<rngA[0].length;j++)
    {
      if(i==0)
     {
        s+='<th id="cell' + i + j + '">' + rngA[i][j] + '</th>';//put ids in each th
      }
      else
      {
        s+='<td id="cell' + i + j + '">' + rngA[i][j] + '</td>';//put ids in each td
       }
    }
    s+='</tr>';
  }
  s+=' </body></html>'
  var html=HtmlService.createHtmlOutputFromFile('html2body');//create output from file
  html.append(s);//and append s for the rest
  SpreadsheetApp.getUi().showModelessDialog(html, 'Sheet to Table')
}

function getParams()//this gives the client side array dimensions
{
  var ss=SpreadsheetApp.getActiveSpreadsheet();
  var sht=ss.getSheetByName('sht2tbl');
  var rng=sht.getDataRange();
  var A=[];
  A.push(rng.getWidth());
  A.push(rng.getHeight());
  return (A);//range width and height in an array
}

function putData(data)//this gets cell contents from the client side and displays them on another sheet named 'tbl2sht'
{
  var ss=SpreadsheetApp.getActiveSpreadsheet();
  var sht=ss.getSheetByName('tbl2sht');
  var h=data.length;
  var w=data[0].length;
  var rng=sht.getRange(1,1,h,w);//create a range properly dimensioned
  rng.setValues(data);//use setValues to load sheet
}

这是htmltobody.html文件。用这种方式创建javascript要容易得多。但我喜欢将数据创建与服务器端谷歌脚本集成。

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script>
    $(function() {

    google.script.run
      .withSuccessHandler(getCellValues)//returns to get values from client side
      .getParams();//get width and height of data array
     });
      function getCellValues(A)
      {
        var w=A[0];
        var h=A[1];
        var data=[];
        for(var i=0;i<h;i++)
        {
          data[i]=[];
          for(var j=0;j<w;j++)
          {
             var s='#cell' + Number(i) + Number(j);
             data[i][j]=$(s).text();//use jquery text to get th and td values          
          }
        }
        google.script.run
          .putData(data);//send data to server side to load data in tbl2sht
      }
      console.log('My Code');//helps me to find code in chrome console
    </script>
  </head>
  <body>

这是用于创建无模式对话框的sht2tbl:

enter image description here

这是创建的对话框:

enter image description here

这是来自名为tbl2sht的工作表上显示的对话框中的数据:

enter image description here

相关问题