0
こんにちは私は2つの中間セルのゼロ値を持つ行を隠す問題を抱えています。中間セルの値はGoogleスプレッドシートから動的に生成されました。私によって書かれたゼロの値を持つ行を非表示にしますが、このコードは生成された値をキャッチしませんでした。セル値= 0の行ベースを非表示
私がしたいことは、値が生成された後に行を非表示にすることですか?私は、この行で問題を発見した出力を警告しようとすると、
<html>
<head>
<meta http-equiv="refresh" content="900">
<link rel="stylesheet" type="text/css" href="http://www.successota.com/dp/example.css"/>
<script type="text/javascript" src="http://www.successota.com/dp/sortable.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
// https://google,developers.appspot.com/chart/interactive/docs/spreadsheets#gid
google.load('visualization', '1', {packages: ['corechart', 'line']});
google.setOnLoadCallback(drawChart);
function drawChart() {
// Add your sheets url and range below
var spreadsheetUrl = ""
var query = new google.visualization.Query(spreadsheetUrl);
query.send(handleQueryResponse);
}
function handleQueryResponse(response) {
var dataTable = response.getDataTable();
// https://developers.google.com/chart/interactive/docs/reference?hl=en#methods
// getValue(rowIndex, columnIndex)
//document.getElementById("test").innerHTML = dataTable.getValue(0, 0);
// --1 --- ok
document.getElementById("B1B").innerHTML = dataTable.getValue(0, 0);
document.getElementById("B1S").innerHTML = dataTable.getValue(0, 1);
document.getElementById("B2B").innerHTML = dataTable.getValue(1, 0);
document.getElementById("B2S").innerHTML = dataTable.getValue(1, 1);
document.getElementById("B3B").innerHTML = dataTable.getValue(2, 0);
document.getElementById("B3S").innerHTML = dataTable.getValue(2, 1);
document.getElementById("B4B").innerHTML = dataTable.getValue(3, 0);
document.getElementById("B4S").innerHTML = dataTable.getValue(3, 1);
document.getElementById("B5B").innerHTML = dataTable.getValue(4, 0);
document.getElementById("B5S").innerHTML = dataTable.getValue(4, 1);
document.getElementById("B6B").innerHTML = dataTable.getValue(5, 0);
document.getElementById("B6S").innerHTML = dataTable.getValue(5, 1);
document.getElementById("B7B").innerHTML = dataTable.getValue(6, 0);
document.getElementById("B7S").innerHTML = dataTable.getValue(6, 1);
document.getElementById("B8B").innerHTML = dataTable.getValue(7, 0);
document.getElementById("B8S").innerHTML = dataTable.getValue(7, 1);
document.getElementById("B9B").innerHTML = dataTable.getValue(8, 0);
document.getElementById("B9S").innerHTML = dataTable.getValue(8, 1);
document.getElementById("B10B").innerHTML = dataTable.getValue(9, 0);
document.getElementById("B10S").innerHTML = dataTable.getValue(9, 1);
document.getElementById("B11B").innerHTML = dataTable.getValue(10, 0);
document.getElementById("B11S").innerHTML = dataTable.getValue(10, 1);
document.getElementById("B12B").innerHTML = dataTable.getValue(11, 0);
document.getElementById("B12S").innerHTML = dataTable.getValue(11, 1);
document.getElementById("B13B").innerHTML = dataTable.getValue(12, 0);
document.getElementById("B13S").innerHTML = dataTable.getValue(12, 1);
document.getElementById("B14B").innerHTML = dataTable.getValue(13, 0);
document.getElementById("B14S").innerHTML = dataTable.getValue(13, 1);
document.getElementById("B15B").innerHTML = dataTable.getValue(14, 0);
document.getElementById("B15S").innerHTML = dataTable.getValue(14, 1);
document.getElementById("B16B").innerHTML = dataTable.getValue(15, 0);
document.getElementById("B16S").innerHTML = dataTable.getValue(15, 1);
document.getElementById("B17B").innerHTML = dataTable.getValue(16, 0);
document.getElementById("B17S").innerHTML = dataTable.getValue(16, 1);
document.getElementById("B18B").innerHTML = dataTable.getValue(17, 0);
document.getElementById("B18S").innerHTML = dataTable.getValue(17, 1);
document.getElementById("B19B").innerHTML = dataTable.getValue(18, 0);
document.getElementById("B19S").innerHTML = dataTable.getValue(18, 1);
document.getElementById("B20B").innerHTML = dataTable.getValue(19, 0);
document.getElementById("B20S").innerHTML = dataTable.getValue(19, 1);
document.getElementById("B21B").innerHTML = dataTable.getValue(20, 0);
document.getElementById("B21S").innerHTML = dataTable.getValue(20, 1);
}
</script>
<script>
setInterval(function() {
var d = new Date();
var seconds = d.getMinutes() * 60 + d.getSeconds(); //convet 00:00 to seconds for easier caculation
var fiveMin = 60 * 5; //five minutes is 300 seconds!
var timeleft = fiveMin - seconds % fiveMin; // let's say 01:30, then current seconds is 90, 90%300 = 90, then 300-90 = 210. That's the time left!
var result = parseInt(timeleft/60) + ':' + timeleft % 60; //formart seconds into 00:00
document.getElementById('test').innerHTML = "Time left to next 5 min update: "+result;
}, 500) //calling it every 0.5 second to do a count down
</script>
<script type="text/javascript">
function HideRow(){
//alert("Hello world");
var tbl = document.getElementById('TabCur'); //find the table
var rows = tbl.querySelectorAll('tbody tr'); //find all rows in the table body
for(i = 0; i < rows.length; i++) { //iterate through the rows
var cells = rows[i].querySelectorAll('td'); //find all of the cells in the row
var flag = true; //set flag prior to cell evaluation
for(j = 1; j < cells.length-1 ; j++) { //iterate through the cells (starting with the cell at position 2)
alert(cells[j].text());
if (cells[j].innerHTML != '0') { //check if the cell contains '0' (set flag to false if cell is not '0')
flag = false;
}
}
if(flag) {
rows[i].classList.add('hide'); //hide the row if the falg remained true (i.e. none of the cells contained a value other than '0'
}
}
}
</script>
<style>
.hide {
display: none;
}
</style>
</head>
<body style="background-color:#f6fbfb;a:link,a:visited,a:hover,a:active {color:#ffffff;}">
<div id="test" style="text-align: center;color:094f68;"></div>
samir
<table class="sortable" id="TabCur" style="vertical-align: top; width: 100%; height:20px; margin-left: auto; margin-right: auto; border-color:#777777;border-width: 1px;" cellspacing="2" cellpadding="2"><caption style="text-align: center;"><span style="color: #ccffff;"></span></caption>
<thead>
<tr style="background-color:#094f68;color:ffffff;line-height:50px">
<td style="text-align: center;" width="40%">A</td>
<td style="text-align: center;" width="10%">B</td>
<td style="text-align: center;" width="10%">C</td>
<td style="text-align: center;" width="40%">D</td>
</tr>
</thead>
<tbody>
<tr style="background-color:#f2eab3;line-height:30px">
<td>Test1</td>
<td style="text-align: center;"><p id="B2B"></p></td>
<td style="text-align: center;"><p id="B2S"></p></td>
<td style="text-align: right;">test1</td>
</tr>
<tr style="background-color:#f2eab3;line-height:30px">
<td>EAL</td>
<td style="text-align: center;"><p id="B3B"></p></td>
<td style="text-align: center;"><p id="B3S"></p></td>
<td style="text-align: right;">Test2</td>
</tr>
<tr style="background-color:#f2eab3;line-height:30px">
<td>test3</td>
<td style="text-align: center;"><p id="B4B"></p></td>
<td style="text-align: center;"><p id="B4S"></p></td>
<td style="text-align: right;">Test3</td>
</tr>
<tr style="background-color:#f2eab3;line-height:30px">
<td>TEST4</td>
<td style="text-align: center;">0</td>
<td style="text-align: center;">0</td>
<td style="text-align: right;">TEST4</td>
</tr>
</tbody>
</table>
</body>
<script>
window.onload = HideRow;
</script>
</html>
が
if (cells[j].innerHTML != '0') {
コードは、この値を取得する:
<p id="B1S"></p>
<p id="B4S"></p>
<p id="B4S"></p>
0
最後の行のみが受け入れられ、隠しているが、他のものは比類ない値を返す
ありがとう。
T drawChartメソッドの最後でHideRow関数を起動します。 – Bardo
@Bardo何も起こりませんでしたが、このコードを最後に追加しました。 –
@Bardoどうすればいいの? –