1、 客户希望报表发布后,通过在页面上设置报表隐藏某一列,以便进行数据显示比较。具体为,页面上有个所有列的下拉框,当选择哪列时该列隐藏,其他列显示;选择无时,所有列都显示。
2、 接着我们在发布报表的jsp中实现该功能:1、制作选择要隐藏的列输入框<select class="text select" id="mode" onchange="modelChange(this);"><option value="col0" selected="selected">无</option><option value="col1" >第一列</option><option value="col2" >第二列</option><option value="col3" >第三列</option><option value="col4" >第四列</option></select>2、然后实现第一列隐藏的js代码if(obj.value=="col1"){//alert("隐藏第一列!");for(var i=0;i<tbs.length;i++){for(var j=0;j<tbs[i].rows.length;j++){for(var k=0;k<tbs[i].rows[j].cells.length;k++){tbs[i].rows[j].cells[k].style.display="";}tbs[i].rows[j].cells[0].style.display="none";}}}3、最后写入发布报表的标签
3、完整代码如下:<%@ page contentType="text/html;charset=GBK" %><%@ taglib uri="/WEB-INF/runqianReport4.tld" prefix="report" %><html><head></head><script type="text/javascript">
4、 function modelChange(obj){//a盟敢势袂lert("调用成功!");var tbs = document.getElementsByTagName("table");//tbs[0].rows[0].cells[0].style.display="none";if(obj.value=="col0"){//alert("显示全部!");for(var i=0;i<tbs.length;i++){for(var j=0;j<tbs[i].rows.length;j++){for(var k=0;k<tbs[i].rows[j].cells.length;k++){tbs[i].rows[j].cells[k].style.display="";}}}}if(obj.value=="col1"){//alert("隐藏第一列!");for(var i=0;i<tbs.length;i++){for(var j=0;j<tbs[i].rows.length;j++){for(var k=0;k<tbs[i].rows[j].cells.length;k++){tbs[i].rows[j].cells[k].style.display="";}tbs[i].rows[j].cells[0].style.display="none";}}}if(obj.value=="col2"){//alert("隐藏第二列!");for(var i=0;i<tbs.length;i++){for(var j=0;j<tbs[i].rows.length;j++){for(var k=0;k<tbs[i].rows[j].cells.length;k++){tbs[i].rows[j].cells[k].style.display="";}tbs[i].rows[j].cells[1].style.display="none";}}}if(obj.value=="col3"){//alert("隐藏第三列!");for(var i=0;i<tbs.length;i++){for(var j=0;j<tbs[i].rows.length;j++){for(var k=0;k<tbs[i].rows[j].cells.length;k++){tbs[i].rows[j].cells[k].style.display="";}tbs[i].rows[j].cells[2].style.display="none";}}}
5、 if(obj.value=="col4争犸禀淫"){//alert("隐藏第四列!");for(var i=0;i<t芟鲠阻缒bs.length;i++){for(var j=0;j<tbs[i].rows.length;j++){for(var k=0;k<tbs[i].rows[j].cells.length;k++){tbs[i].rows[j].cells[k].style.display="";}tbs[i].rows[j].cells[3].style.display="none";}}}}</script><body><div><ul><li><font>选择要隐藏的列:</font><select class="text select" id="mode" onchange="modelChange(this);"><option value="col0" selected="selected">无</option><option value="col1" >第一列</option><option value="col2" >第二列</option><option value="col3" >第三列</option><option value="col4" >第四列</option></select></li></ul></div><report:html name="report1" reportFileName="hiddenCell.raq"funcBarLocation=""needPageMark="yes"generateParamForm="no"needSaveAsExcel="yes"exceptionPage="/reportJsp/myError2.jsp"/></body></html>