Solved

Gridview render contained in a DIV

Posted on 2006-11-28
15
9,667 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 7
  • 2
  • 2
  • +4
15 Comments
 
LVL 9

Expert Comment

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

Author Comment

by:Valimai
ID: 18033780
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
ID: 18033845
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
Online Training Solution

Drastically shorten your training time with WalkMe's advanced online training solution that Guides your trainees to action. Forget about retraining and skyrocket knowledge retention rates.

 
LVL 4

Assisted Solution

by:darkpriest
darkpriest earned 100 total points
ID: 18034703
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
ID: 18034715
You don't have much control over what ASP.NET generates inside the grid view control.
0
 
LVL 1

Author Comment

by:Valimai
ID: 18034897
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
ID: 18037163
What problem is the <div> causing?

Bob
0
 
LVL 1

Author Comment

by:Valimai
ID: 18041033
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
ID: 18044534
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
1
 
LVL 1

Author Comment

by:Valimai
ID: 18049624
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
ID: 20636094
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
ID: 23669135
I'm looking at doing the same thing.  How did you acheive it in the end?
0
 
LVL 1

Author Comment

by:Valimai
ID: 23676315
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
ID: 24952139
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
ID: 24956800
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

SharePoint Admin?

Enable Your Employees To Focus On The Core With Intuitive Onscreen Guidance That is With You At The Moment of Need.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Just a quick little trick I learned recently.  Now that I'm using jQuery with abandon in my asp.net applications, I have grown tired of the following syntax:      (CODE) I suppose it just offends my sense of decency to put inline VBScript on a…
Today is the age of broadband.  More and more people are going this route determined to experience the web and it’s multitude of services as quickly and painlessly as possible. Coupled with the move to broadband, people are experiencing the web via …
If you're a developer or IT admin, you’re probably tasked with managing multiple websites, servers, applications, and levels of security on a daily basis. While this can be extremely time consuming, it can also be frustrating when systems aren't wor…
There's a multitude of different network monitoring solutions out there, and you're probably wondering what makes NetCrunch so special. It's completely agentless, but does let you create an agent, if you desire. It offers powerful scalability …

724 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