简体   繁体   English

隐藏显示表中的列

[英]hide column in display table

Is there any way we can hide column of display table,we have media="none" which hides the column .i have tried using 有什么办法可以隐藏显示表的列,我们有media =“ none”来隐藏列。我尝试使用

document.getElementById(display_column_name).media="none";

but it is not working, i am stuck while setting attritube of display column in javascript is there any way.As on button select column is to hide/display of display table. 但它不起作用,我在设置javascript中显示列的attritube时卡住了。由于按钮选择列是隐藏/显示表的显示。

i have checkbox on column header.i have to hide columns of display table.selected column is hiden on button click. 我在列标题上具有复选框。我必须隐藏显示表的列。单击按钮时隐藏选定的列。

i have also tried using div tag for display column 我也尝试过使用div标签显示列

<div id= "col1" style="display:block">
            <display:column paramId="date_disp" paramName="date_disp"  property="date_disp" title="Date" sortable="true" headerClass="sortable" decorator="com.commons.ColDateDecorator" style="font-family:Arial, Helvetica, sans-serif;font-size: 12px;height: 25;"/>
</div>

and document.getElementById('col1').style.display="none"; 和document.getElementById('col1')。style.display =“ none”; but its not working. 但它不起作用。

Is it one element that you want to hide or severals ? 是要隐藏的元素还是多个元素? document.getElementsByName will return you an array of elements so you need to access it like this: document.getElementsByName将返回一个元素数组,因此您需要像这样访问它:

document.getElementsByName(display_column_name)[0].media="none" document.getElementsByName(display_column_name)[0] .media =“ none”

If it's just one element and this element has a id consider using this maybe: 如果只是一个元素并且该元素具有ID,请考虑使用以下方法:

getElementById()

Also i assume display_column_name is a variable defines previously right? 我也假设display_column_name是一个先前定义的变量,对吗?

The best way to this is to set the css display style to none. 最好的方法是将css显示样式设置为none。

document.getElementById("id _of_the_component").style.display = 'none';

Or you can use jquery Library but you have to download jquery library from jquery.com. 或者,您可以使用jquery库,但必须从jquery.com下载jquery库。 Import the script into your page with the script tag and do the following 使用script标签将脚本导入您的页面,然后执行以下操作

$("#id _of_the_component).hide();

Try the following: 请尝试以下操作:

HTML: HTML:

<html>
    <table>
        <tr>
            <td id="td1">TD1</td>
            <td id="td2">TD2</td>
            <td id="td3">TD3</td>
        </tr>        
    </table>
</html>

JavaScript: JavaScript:

document.getElementById("td2").style.display = "none";

Demo: http://jsfiddle.net/Vishal_Suthar3/kDb8Z/ 演示: http//jsfiddle.net/Vishal_Suthar3/kDb8Z/

Uchenna is right you can use jquery library Uchenna是正确的,您可以使用jQuery库

Import the script into your page using script tag 使用脚本标记将脚本导入页面

add an attribute "id" or "class" to column you want to hide 向要隐藏的列添加属性“ id”或“ class”

and using that class or id you can hide that element. 并使用该类或ID可以隐藏该元素。

eg. 例如。 if you have mantioned id attribute and valuse is "abc" 如果您具有提及的id属性,并且valuse为“ abc”

then you can write : 那么你可以写:

$(document).ready(function() 
{
$("#abc").hide();
});

modify your display column like : 修改显示列,例如:

<display:column class="abc" paramId="date_disp" paramName="date_disp"  property="date_disp" title="Date" sortable="true" headerClass="sortable" decorator="com.commons.ColDateDecorator" style="font-family:Arial, Helvetica, sans-serif;font-size: 12px;height: 25;"/>

on button click you can write : lets say you are using button 在按钮上单击,您可以编写:可以说您正在使用按钮

<input type="submit" value="Submit" id="success" />
then you can use it like :

    $('#success').click(function(){
    $(".abc").hide();   
     });

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM