Hiding / Showing a Table with JavaScript
hi i have atable with some data and i have expand and Collapse button there if we click on + it will expand and show table and if we click on-it will collapse and i am using following code but i am getting error with
document.getElementById('eleName');
imageXchk='expand';
loadedCheck='false';
function toggleDisplayCheck(e, tableSize){
element = document.getElementById(e).style;
if (element.display=='none') {
element.display='block';
}
else {
element.display='none';
}
if (loadedCheck=='false') {
myUpdater('returnsDetailsTable', '/oasis/faces/merchant/dashboard/ReturnsDetailsCheck.jsp', { method: 'get' });
loadedCheck='true'
}
size = tableSize-1;
eleName = 'mercPerfDashboardForm:returnsDetailsTable:' + siz开发者_StackOverflow社区e +':switchimageRetChk'
if (imageXchk=='collapse') {
document.getElementById('eleName').src='${pageContext.request.contextPath}/images/expand.gif';imageXchk='expand';
}
else {
document.getElementById('eleName').src='${pageContext.request.contextPath}/images/collapse.gif';imageXchk='collapse';
}
return false;
}
If the element's style's display
property hasn't been explicitly set previously in JavaScript, it will be empty, even if the element is hidden via some CSS rule. The easiest thing to do would be to know what the initial state (hidden or visible) is and assume that state if the display
property is empty:
if (element.display=='none' || element.display=='') {
element.display='block';
}
else {
element.display='none';
}
you can use jQuery to do this very very simple:
$("#table_id").hide(); // hide the table
$("#table_id").show(); // show the table
精彩评论