How to hide randomly generated row of gridview

HI coder i have a gridview in which data comes from database.. now id of all row is same what i want it to show only first row of my gridview and hide rest of the others but not their value i just wana hide them. i want their value because i have a lightbox on it.

this is my code:

<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();
    }
}

in the above code pptId is same for each row, my images show inside my gridview what i want is to show only first images and hide rest of other but not their values..

how to i do that…..thanks in advance

Contents hide

Answers:

Method 1

Method 2

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

Can’t you just do this with css?

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

There is an explanation of the nth-child css-selector here:

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

I’ve also explained it in another answer here:

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

You would probably need a class or a static id on the generated table so you can single that table out, but still…

Edit following comments:

Try adding a css class to the gridview and adding the css above like this:

<!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 will generate an html table from your gridview, that is why you need to apply styling to a table. The browser never sees any asp.net code. That code is simply a way of generating html that the browser knows how to display.

Edit regarding better IE support:

I guess what you are asking is for IE8 (and possibly 7) support, as IE9 and up support nth-child. To support IE7 and up, change your css to use the + selector, which has better support:

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

The + selector is the adjacent sibling selector. The selector tr + tr thus selects any tr that immediatly follows another tr element. For further exaplnation see: http://css-tricks.com/child-and-sibling-selectors/ (specifically the section titled ‘Adjacent sibling combinator’).

Method 2

I think it’s what you are looking for :

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

Use it after binding datasource to GridView1 in code behind.

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes

Article Rating