[英]Change style display for cells with Javascript
I want to do something like this: user selects one radio button (lock,delete or compare). 我想做这样的事情:用户选择一个单选按钮(锁定,删除或比较)。 I want to show to him only the relevant column from the table.
我只想向他显示表中的相关列。 (each option has different column).
(每个选项都有不同的列)。 The table is ajax.
该表是ajax。 I guess i need to change the display style for every cell but i don't know how.
我想我需要更改每个单元的显示样式,但是我不知道如何。
Here is example: 这是示例:
Here i want to change the display of the cells 在这里我想更改单元格的显示
function ButtonForTbl(value) {
var x=document.getElementById("audithead").rows[0].cells;
if (value == "lock"){
document.getElementById('lock').checked = true;
//something like for(...)lockCell.style.display=''
//something like for(...)deleteCell.style.display='none'
//something like for(...)compareCell.style.display='none'
}
else if(value == "delete"){
document.getElementById('delete').checked = true;
//something like for(...)lockCell.style.display='none'
//something like for(...)deleteCell.style.display=''
//something like for(...)compareCell.style.display='none'
}
else{
document.getElementById('compare').checked = true;
}
}
I guess i need something like that: 我想我需要这样的东西:
for (i = 0; i < deleteCell.length; i++)
deleteCell[i].style.display='' = true ;
The table: 桌子:
oCell = oRow.insertCell(-1);
oCell.setAttribute('id','comCell' );
oCell.setAttribute('align', 'center');
oCell.innerHTML = "<input type='checkbox' id='com' value='"+ ind + "'name='com[]'>";
oCell = oRow.insertCell(-1);
oCell.setAttribute('id','lockCell' );
oCell.setAttribute('align', 'center');
oCell.innerHTML = "<input type='checkbox' id='lock' value='"+ ind + "'name='lock[]'>";
Radio buttons: 单选按钮:
<input type="radio" value="compare" id="compare" name="choose" onclick="ButtonForTbl(this.value)"/> Compare
<input type="radio" value="delete" id="delete" name="choose" onclick="ButtonForTbl(this.value)"/> Delete
<input type="radio" value="lock" id="lock" name="choose" onclick="ButtonForTbl(this.value)"/> Lock<br/>
The table html: 表格html:
<table class="auditable">
<thead id="audithead">
<tr><td></td></tr>
</thead>
<tbody id="auditTblBody">
</tbody>
</table>
EDIT: Full row is like that: 编辑:全行是这样的:
<tr>
<td align="center" id="lockCell" style="display: none;">
<input type="checkbox" onclick="" name="lock[]" value="1500" id="lock"></td>
<td align="center" id="delCell" style="display: none;">
<input type="checkbox" name="del[]" value="1500"></td>
<td align="center" id="comCell">
<input type="checkbox" onclick="setChecks(this)" name="com[]" value="1500" id="com"></td>
<td width="65px">100% 1/1</td><td width="105px">2011-01-10 17:47:37</td>
</tr>
Thank you so much! 非常感谢!
You can do the same thing with a div or any other element. 您可以使用div或任何其他元素执行相同的操作。 The javascript would look like:
javascript看起来像:
<script language='javascript'>
<!-- //
function setProperties(obj)
{
if(obj.value == "yes")
{
document.mydiv.style.display = "block";
} else {
document.mydiv.style.display = "none";
}
}
// -->
</script>
And in the body: 在体内:
<input type=radio name="update" value="yes" checked onclick="setProperties(this)">Yes<br />
<input type=radio name="update" value="no" onclick="setProperties(this)">No<br />
<div id='mydiv'>some text here</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.