如何隐藏随机生成的gridview行

时间:2014-01-27 11:07:11

标签: c# asp.net gridview lightbox

HI编码器我有一个gridview,其中数据来自数据库..现在所有行的ID都是我希望它只显示我的gridview的第一行并隐藏其余的其他但不是它们的值我只是wana hide他们。我想要他们的价值,因为我有一个灯箱。

这是我的代码:

<asp:GridView ID="GridView1" runat="server" CellPadding="4" ForeColor="#333333" GridLines="None"
        AutoGenerateColumns="False" PageSize="1" PersistedSelection="true" 
    DatakeyNames="pptId,Priority">
        <Columns>

            <asp:TemplateField HeaderText="pptId" Visible="false">
                <ItemTemplate>
                    <asp:Label ID="lblpptId" runat="server" Text='<%# Bind("pptId") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>    
          <asp:TemplateField HeaderText="Priority" Visible="false">
                <ItemTemplate>
                    <asp:Label ID="lblPriority" runat="server" Text='<%# Bind("Priority") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField> 
            <asp:TemplateField HeaderText="View PPT">
                <ItemTemplate>
                    <a id="imageLink" href='<%# Eval("Imageurl") %>' title='<%#Eval("Description") %>'
                        rel="lightbox[Brussels]" runat="server">Start PPT</a>
                </ItemTemplate>
            </asp:TemplateField>                
        </Columns>
        <AlternatingRowStyle BackColor="White" />
        <EditRowStyle BackColor="#2461BF" />
        <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
        <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
        <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
        <RowStyle BackColor="#EFF3FB" />
        <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
        <SortedAscendingCellStyle BackColor="#F5F7FB" />
        <SortedAscendingHeaderStyle BackColor="#6D95E1" />
        <SortedDescendingCellStyle BackColor="#E9EBEF" />
        <SortedDescendingHeaderStyle BackColor="#4870BE" />
         </asp:GridView>

EDIT ::

protected void Page_Load(object sender, EventArgs e)
{
    BindModule();

}
protected void BindModule()
{
    try
    {
        con.Open();
        string id = Request.QueryString["pptId"].ToString();
        //Query to get Imagesurl and Description from database
        SqlCommand command = new SqlCommand("select * from Image_Master where pptId='" + id + "' and IsEnable='True' order by Priority", con);
        dt = new DataTable();
        SqlDataAdapter da = new SqlDataAdapter(command);
        da.Fill(dt);          
        GridView1.DataSource = dt;
        GridView1.DataBind();                      
        GridView1.Dispose();
    }
    catch (Exception ex)
    {
        Response.Write("Error occured : " + ex.Message.ToString());
    }
    finally
    {
        con.Close();
    }
}

在上面的代码中pptId对于每一行是相同的,我的图像在我的gridview中显示我想要的只是显示第一个图像并隐藏其他的其他但不是它们的值..

如何做到这一点.....提前感谢

2 个答案:

答案 0 :(得分:1)

你不能用css做这个吗?

table tr:nth-child(n + 3) {
    display: none;
}

这里有关于nth-child css-selector的解释:

http://css-tricks.com/how-nth-child-works/

我还在另一个答案中解释了这一点:

https://stackoverflow.com/a/21166162/1256868

您可能需要在生成的表上使用类或静态ID,以便您可以单独输出该表,但仍然...

编辑以下评论:

尝试将css类添加到gridview并在上面添加css,如下所示:

<!DOCTYPE html>
<html>
<head>
    <style type="text/css">
        table.Grid tr:nth-child(n + 3) {
            display: none;
        }
    </style>
</head>
<body>
    <form runat="server">
    <asp:GridView runat="server" CssClass="Grid">
        <%--Your templates here--%>
    </asp:GridView>
    </form>
</body>
</html>

Asp.net将从您的gridview生成一个html表,这就是您需要将样式应用于表的原因。浏览器永远不会看到任何asp.net代码。该代码只是生成浏览器知道如何显示的html的一种方式。

关于更好的IE支持的编辑:

我想你要问的是IE8(可能还有7个)支持,因为IE9和支持nth-child。要支持IE7及更高版本,请更改您的css以使用+选择器,它具有更好的支持:

table.Grid tr + tr + tr{    
    display: none;
}

+选择器是相邻的兄弟选择器。因此,选择器tr + tr选择任何立即跟随另一个tr元素的tr。如需进一步了解,请参阅:http://css-tricks.com/child-and-sibling-selectors/(特别是标题为“相邻兄弟组合子”的部分)。

答案 1 :(得分:0)

我认为这就是你要找的东西:

for(int i = 1; i < GridView1.Rows.Count; i++)
{
    GridView1.Rows[i].Visible = false;
}

将数据源绑定到后面的代码中的GridView1之后使用它。