Solved

Gridview render contained in a DIV

Posted on 2006-11-28
15
9,378 Views
Last Modified: 2012-08-13
Hi Experts

I need to either be able to reference (to apply style) or eliminate the DIV which renders with the gridview. In the example, i am not adding a datasource so the table which is ther grid doesn't appear, note the Div that does appear.

ASPX Example - with empty gridview
------------------------------------------
<form id="form1" runat="server">
START
<asp:GridView ID="GridView1" runat="server">
</asp:GridView>
END
</form>

HTML VIEW SOURCE
------------------------
<form name="form1" method="post" action="Default2.aspx" id="form1">
START
<div>

</div>
END
</form>

thanks
0
Comment
Question by:Valimai
  • 7
  • 2
  • 2
  • +4
15 Comments
 
LVL 9

Expert Comment

by:kraffay
Comment Utility
Make the DIV server side and set visible = false.
0
 
LVL 1

Author Comment

by:Valimai
Comment Utility
The DIV is rendered as part of the <asp:GridView ID="GridView1" runat="server"> tag.

How can i stop it rendering or how can i access it?
0
 
LVL 1

Author Comment

by:Valimai
Comment Utility
Just look at my original post. I have the ASPX source and the view source output. otice the DIV is not in my ASPX, my gridview is generating it. I do not want that DIV tag or, how can i reference it to apply a style (it has no ID!).
0
 
LVL 4

Assisted Solution

by:darkpriest
darkpriest earned 100 total points
Comment Utility
Place a div around the gridview itself,

<div runat="server" id="blah" visible="false">  <---- you can make it invisible there

<asp:GridView.....

</asp:GridView>


</div>

Or on a page load

Me.blah.visible = false <-- References the div

If GridView1.rows.count = 0
  Me.blah.visible = false
EndIf

'----------- You could do that to make it invisible if there's nothing there.

It SHOULD... Should being the hopeful and operative word remove the <div> tag.
0
 
LVL 9

Assisted Solution

by:kraffay
kraffay earned 100 total points
Comment Utility
You don't have much control over what ASP.NET generates inside the grid view control.
0
 
LVL 1

Author Comment

by:Valimai
Comment Utility
darkpriest, I tried placing another div outside, but the generated <div> seems to interfere. When I view and save source as HTML, I manually remove that DIV and my page works. Which is why i want to reference it or delete it.

Kraffay, it appears I need to intercept the render html writer and manually remove the div from the source before it is posted to the browser.

Anyone else please help?!?!
0
 
LVL 96

Expert Comment

by:Bob Learned
Comment Utility
What problem is the <div> causing?

Bob
0
Why You Should Analyze Threat Actor TTPs

After years of analyzing threat actor behavior, it’s become clear that at any given time there are specific tactics, techniques, and procedures (TTPs) that are particularly prevalent. By analyzing and understanding these TTPs, you can dramatically enhance your security program.

 
LVL 1

Author Comment

by:Valimai
Comment Utility
Here is my sample code. When run from the ASPX the grid scrolls, however the first column is not locked. Do a view source and save the html as DEFAULT.HTM next to the ASPX. Edit and remove the <div> </div> which is outside the table, which is the grid. When you run the HTM page, see how the first column stays locked.

(you may need to make you browser window smaller to see scroll bars on the grid)

thank you

locked-column.css
---------------------
TABLE { BORDER-COLLAPSE: collapse; BACKGROUND-COLOR: whitesmoke}
THEAD TH {BORDER-RIGHT: silver 1px solid; FONT-WEIGHT: bold; FONT-SIZE: 14px; COLOR: white; POSITION: relative; BACKGROUND-COLOR: navy; TEXT-ALIGN: center}
THEAD TH.locked {BORDER-RIGHT: silver 1px solid; FONT-WEIGHT: bold; FONT-SIZE: 14px; COLOR: white; POSITION: relative; BACKGROUND-COLOR: navy; TEXT-ALIGN: center}
THEAD TH {Z-INDEX: 20; TOP: expression(document.getElementById("tbl-container").scrollTop-2)}
THEAD TH.locked {Z-INDEX: 30}
TD.locked {BORDER-RIGHT: silver 1px solid; FONT-WEIGHT: bold; Z-INDEX: 10; LEFT: expression(parentNode.parentNode.parentNode.parentNode.scrollLeft); POSITION: relative; BACKGROUND-COLOR: #ffeaff}
TH.locked {      BORDER-RIGHT: silver 1px solid; FONT-WEIGHT: bold; Z-INDEX: 10; LEFT: expression(parentNode.parentNode.parentNode.parentNode.scrollLeft); POSITION: relative; BACKGROUND-COLOR: #ffeaff}
TD {      PADDING-RIGHT: 5px; PADDING-LEFT: 2px; FONT-SIZE: 12px; PADDING-BOTTOM: 2px; BORDER-LEFT: silver 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: silver 1px solid; TEXT-ALIGN: right}

ASPX
------
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" EnableViewState=false %>
<html>
<head runat="server">
    <LINK href="locked-column.css" type=text/css rel=stylesheet>
</head>
<body>
    <form id="form1" runat="server">
    <DIV id=tbl-container  style="OVERFLOW: auto; WIDTH: 100%; HEIGHT: 500px; ">
            <asp:GridView ID="gv" runat="server" OnRowDataBound="gv_RowDataBound" Width="200px">
            </asp:GridView>
            
    </div>
    </form>
</body>
</html>

CODE BEHIND
---------------
public partial class Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        DataTable dt = new DataTable();
        dt.Columns.Add(new DataColumn("ID"));
        dt.Columns.Add(new DataColumn("NameOne"));
        dt.Columns.Add(new DataColumn("NameTwo"));
        dt.Columns.Add(new DataColumn("NameThree"));
        dt.Columns.Add(new DataColumn("NameFour"));
        dt.Columns.Add(new DataColumn("NameFive"));
        dt.Columns.Add(new DataColumn("NameSix"));
        dt.Columns.Add(new DataColumn("NameSeven"));

        DataRow dr;

        for (int i = 0; i < 40; i++)
        {
            dr = dt.NewRow();
            dr["ID"] = "123456789012345678901234567890";
            dr["NameOne"] = "123456789012345678901234567890";
            dr["NameTwo"] = "123456789012345678901234567890";
            dr["NameThree"] = "123456789012345678901234567890";
            dr["NameFour"] = "123456789012345678901234567890";
            dr["NameFive"] = "123456789012345678901234567890";
            dr["NameSix"] = "123456789012345678901234567890";
            dr["NameSeven"] = "123456789012345678901234567890";

            dt.Rows.Add(dr);
        }



        gv.DataSource = dt;
        gv.DataBind();

        gv.UseAccessibleHeader = true;
        gv.HeaderRow.TableSection = TableRowSection.TableHeader;
        gv.FooterRow.TableSection = TableRowSection.TableFooter;


    }

    protected void gv_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        e.Row.Cells[0].CssClass = "locked";
    }

}
0
 
LVL 96

Accepted Solution

by:
Bob Learned earned 300 total points
Comment Utility
Very nice to know what you were trying to do, but unfortunately the GridView doesn't give you access to the <div> element AFAIK.

Bob
0
 
LVL 1

Author Comment

by:Valimai
Comment Utility
i will try to intercept the div element and remove it via or before the
protected override void Render(HtmlTextWriter writer)
event.
0
 
LVL 3

Expert Comment

by:Sanctus
Comment Utility
I wonder if you could ever remove the div...
I am rendering HTML to a special device and I really would like to take it out..
0
 

Expert Comment

by:agriffit
Comment Utility
I'm looking at doing the same thing.  How did you acheive it in the end?
0
 
LVL 1

Author Comment

by:Valimai
Comment Utility
I have moved on from that project, but do see myself revisiting it this year.

A barbaric method could be to use Jquery. Use Jquery to find the control ID, and use a command to remove the parent wrapping element. The DIV in our case.
0
 

Expert Comment

by:nomadsolo
Comment Utility
To eliminate the div you can inherit from gridview and override:

Protected Overrides Sub Render(ByVal writer As HtmlTextWriter)
        Me.RenderOverriden(writer, False)
    End Sub

    Private Sub RenderOverriden(ByVal writer As HtmlTextWriter, ByVal renderPanel As Boolean)
        If (Not Me.Page Is Nothing) Then
            Me.Page.VerifyRenderingInServerForm(Me)
        End If
        Me.PrepareControlHierarchy()
        Me.RenderContents(writer)
    End Sub

I am not sure what the ramifications of this override, but it will remove the div.
0
 
LVL 1

Author Comment

by:Valimai
Comment Utility
thank you for taking the time to post that. Next time i have this situation, which could be soon, i will refer to this thread.

have a nice day.
0

Featured Post

Enabling OSINT in Activity Based Intelligence

Activity based intelligence (ABI) requires access to all available sources of data. Recorded Future allows analysts to observe structured data on the open, deep, and dark web.

Join & Write a Comment

One of the pain points with developing AJAX, JavaScript, JQuery, and other client-side behaviors is that JavaScript doesn’t allow for cross domain request for pulling content. For example, JavaScript code on www.johnchapman.name could not pull conte…
IntroductionWhile developing web applications, a single page might contain many regions and each region might contain many number of controls with the capability to perform  postback. Many times you might need to perform some action on an ASP.NET po…
This demo shows you how to set up the containerized NetScaler CPX with NetScaler Management and Analytics System in a non-routable Mesos/Marathon environment for use with Micro-Services applications.
This video explains how to create simple products associated to Magento configurable product and offers fast way of their generation with Store Manager for Magento tool.

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now