2016-06-23 35 views
0

这也许是一个语法问题。问题的核心是将列切换为行,但这似乎比生成一张表格给我所需的每列数据更复杂。使用用户选择的变量在融合表查询中选择一列

问题是我如何将变量“沙滩”传递给融合表的SELECT查询?输出应该是一个两列表格; COL0和选定的列形成该表fusiontable with all data per column

<html> 
    <head> 
    <meta charset="UTF-8"> 

    <title>Beach pollution individual results</title> 

    <link href="/apis/fusiontables/docs/samples/style/default.css" 
     rel="stylesheet" type="text/css"> 
    <script type="text/javascript" src="https://www.google.com/jsapi"></script> 

    <style type="text/css"> 



    </style> 

    <script type="text/javascript"> 
     google.load('visualization', '1'); 

     function drawTable() { 
     // Construct query 
     var beach = document.getElementById('beach').value; 
     var query = "SELECT ' 'col0', '" beach "' " +'FROM 1cmRBkYKhvdGUR-xXBLcMGU67koVYEgpDJT6jxOnA'; 

     var queryText = encodeURIComponent(query); 
     var gvizQuery = new google.visualization.Query('http://www.google.com/fusiontables/gvizdata?tq=' + queryText); 

     // Send query and draw table with data in response 
     gvizQuery.send(function(response) { 
      var numRows = response.getDataTable().getNumberOfRows(); 
      var numCols = response.getDataTable().getNumberOfColumns(); 

      var ftdata = ['<table><thead><tr>']; 
      for (var i = 0; i < numCols; i++) { 
      var columnTitle = response.getDataTable().getColumnLabel(i); 
      ftdata.push('<th>' + columnTitle + '</th>'); 
      } 
      ftdata.push('</tr></thead><tbody>'); 

      for (var i = 0; i < numRows; i++) { 
      ftdata.push('<tr>'); 
      for(var j = 0; j < numCols; j++) { 
       var rowValue = response.getDataTable().getValue(i, j); 
       ftdata.push('<td>' + rowValue + '</td>'); 
      } 
      ftdata.push('</tr>'); 
      } 
      ftdata.push('</tbody></table>'); 
      document.getElementById('ft-data').innerHTML = ftdata.join(''); 
     }); 
     } 

     google.setOnLoadCallback(drawTable); 
    </script> 

    </head> 
    <body> 
    <div> 
     <label>Beach:</label> 
     <select id="beach" onchange="drawTable();"> 
     <option value="" selected="selected">All</option> 
     <option value="Baye de Clarens">Baye de Clarens</option> 
     <option value="Pierrier">Pierrier</option> 
     <option value="Pierrier sud">Pierrier sud</option> 
     <option value="Maladaire">Maladaire</option> 
     <option value="Le Port, La Tour-de-Peilz">Port de La La Tour-de-Peilz</option> 
     <option value="Bain des Dames">Bain des dames</option> 
     <option value="Oyonne">Oyonne</option> 
     <option value="Veveyse">Veveyse</option> 
     <option value="L' Arabie">l'Arabie</option> 
     <option value="Montreux">Montreux</option> 
     <option value="Boiron">Boiron</option> 
     <option value="Villa Barton">Villa Barton</option> 
     <option value="Jardin ">Jardin Botanique</option> 
     <option value="Thonnon">Thonnon</option> 
     </select> 
    </div> 
    <div id="ft-data"></div> 
    </body> 
</html> 

这是非常相似的另一个问题,我问,该解决方案作品,将是使用主网页,但这个想法是给当地居民,以获得speicifc细节和海滩上的数据。

感谢

回答

0

有在js语法错误 '查询=' 语句

1)了解如何使用引号。

2)+是JavaScript运营商连接字符串

var beach = 'Utah'; 

// var query = "SELECT ' 'col0', '" beach "' " +'FROM 1cmRBkYKhvdGUR-xXBLcMGU67koVYEgpDJT6jxOnA'; 

var query = "SELECT 'col0', '" + beach + "' FROM 1cmRBkYKhvdGUR-xXBLcMGU67koVYEgpDJT6jxOnA"; 

console.log(query); 
+0

谢谢,我想通了几个小时后。它现在可以按照它的方式工作。我投了票,但我没有足够的声望点来公开展示。 –

+0

@Roger。如果您将答案标记为“已接受”,其他人将不会花时间回答已经回答的问题。询问的人可以将一个答案标记为接受。 – PaulH

+0

感谢您查看我的信息 –