DataGrid (body only) contained in <span>...</span> tags

[Dan Bishop]

Hi,

I have a DataGrid control that displays many records. As such, I have
been given a requirement to contain only the body of my DataGrid
control within <span> tags (this enables us to use a scroll bar to
look through the records in the datagrid, instead of using paging).

My problem is this: How can I get the header for the DataGrid to be
displayed outside the <span>? I do not know if this is possible with
the ASP.NET built-in DataGrid control, but I would be most interested
in learning possible solutions... the current code that I am using is
posted below. It shows the DataGrid entirely wrapped in the <span>,
meaning that the Header is not visible once you scroll down a little
bit...

CODE:
<span runat="server" id="dgSpan">
<asp:DataGrid ID="dgIssueListing" GridLines="Both" BorderWidth="2px"
CssClass="regularText" AutoGenerateColumns="False" AllowSorting="True"
AllowPaging="False" ShowHeader="True"
ShowFooter="False"Runat="server">
<Columns>
<asp:ButtonColumn ButtonType="LinkButton" CommandName="Select"
Visible="False"></asp:ButtonColumn>
<asp:TemplateColumn HeaderText="ID" SortExpression="issueID">
<HeaderStyle HorizontalAlign="Center"></HeaderStyle>
<ItemStyle HorizontalAlign="Center" Width="25px"></ItemStyle>
<ItemTemplate>
<asp:Label ID="lblIssueID" Width="25px" Text='<%#
DataBinder.Eval(Container.DataItem, "issueID")%>' Runat="server"
CssClass="regularText">
</asp:Label>
</ItemTemplate>
</asp:TemplateColumn>
<asp:BoundColumn HeaderText="Status" DataField="status"
SortExpression="status" HeaderStyle-HorizontalAlign="Center"
ItemStyle-HorizontalAlign="Center"
ItemStyle-Width="45px"></asp:BoundColumn>
<asp:BoundColumn HeaderText="Priority" DataField="priority"
SortExpression="priority" HeaderStyle-HorizontalAlign="Center"
ItemStyle-HorizontalAlign="Center"
ItemStyle-Width="45px"></asp:BoundColumn>
<asp:BoundColumn HeaderText="Task" DataField="taskDesc"
SortExpression="taskDesc" ItemStyle-Width="120px"></asp:BoundColumn>
<asp:BoundColumn HeaderText="Subject" DataField="issueSubj"
SortExpression="issueSubj" ItemStyle-Width="275px"></asp:BoundColumn>
</Columns>
<HeaderStyle BackColor="Gray" ForeColor="White"
Font-Bold="True"></HeaderStyle>
</asp:DataGrid>
</span>

Many Thanks,
-Dan Bishop

[Kilic Beg]

you can create another datagrid before the <span> tag and display only the
header there...
you should clear (delete all rows) from your dataset before you bind to the
header DataGrid...

or also...
you create a <DIV> tag before the <span> tag and move the header there with
javascript...
below is the code....
=================================
<script language="javascript>
var dg = document.getElementById("dgIssueListing");
var dgTbl = dg.getElementsByTagName("table");
dgTbl= dgTbl[0];

var rowcopy = dgTbl.rows[0].cloneNode(true);
DivHeaderTbl.rows[0].appendChild(rowcopy);

dgTbl.rows[0].removeNode();
DivHeaderTbl.moveRow(1,0);
</script>
=====================================

---------
Kilic Beg


"Dan Bishop" <d2bishop@engmail.uwaterloo.ca> wrote in message
news:398bf3d0.0406070452.389824e6@posting.google.c om...

> Hi,
>
> I have a DataGrid control that displays many records. As such, I have
> been given a requirement to contain only the body of my DataGrid
> control within <span> tags (this enables us to use a scroll bar to
> look through the records in the datagrid, instead of using paging).
>
> My problem is this: How can I get the header for the DataGrid to be
> displayed outside the <span>? I do not know if this is possible with
> the ASP.NET built-in DataGrid control, but I would be most interested
> in learning possible solutions... the current code that I am using is
> posted below. It shows the DataGrid entirely wrapped in the <span>,
> meaning that the Header is not visible once you scroll down a little
> bit...
>
> CODE:
> <span runat="server" id="dgSpan">
> <asp:DataGrid ID="dgIssueListing" GridLines="Both" BorderWidth="2px"
> CssClass="regularText" AutoGenerateColumns="False" AllowSorting="True"
> AllowPaging="False" ShowHeader="True"
> ShowFooter="False"Runat="server">
> <Columns>
> <asp:ButtonColumn ButtonType="LinkButton" CommandName="Select"
> Visible="False"></asp:ButtonColumn>
> <asp:TemplateColumn HeaderText="ID" SortExpression="issueID">
> <HeaderStyle HorizontalAlign="Center"></HeaderStyle>
> <ItemStyle HorizontalAlign="Center" Width="25px"></ItemStyle>
> <ItemTemplate>
> <asp:Label ID="lblIssueID" Width="25px" Text='<%#
> DataBinder.Eval(Container.DataItem, "issueID")%>' Runat="server"
> CssClass="regularText">
> </asp:Label>
> </ItemTemplate>
> </asp:TemplateColumn>
> <asp:BoundColumn HeaderText="Status" DataField="status"
> SortExpression="status" HeaderStyle-HorizontalAlign="Center"
> ItemStyle-HorizontalAlign="Center"
> ItemStyle-Width="45px"></asp:BoundColumn>
> <asp:BoundColumn HeaderText="Priority" DataField="priority"
> SortExpression="priority" HeaderStyle-HorizontalAlign="Center"
> ItemStyle-HorizontalAlign="Center"
> ItemStyle-Width="45px"></asp:BoundColumn>
> <asp:BoundColumn HeaderText="Task" DataField="taskDesc"
> SortExpression="taskDesc" ItemStyle-Width="120px"></asp:BoundColumn>
> <asp:BoundColumn HeaderText="Subject" DataField="issueSubj"
> SortExpression="issueSubj" ItemStyle-Width="275px"></asp:BoundColumn>
> </Columns>
> <HeaderStyle BackColor="Gray" ForeColor="White"
> Font-Bold="True"></HeaderStyle>
> </asp:DataGrid>
> </span>
>
> Many Thanks,
> -Dan Bishop

[Kilic Beg]

also check this article out..
[url]http://www.dnzone.com/ShowDetail.asp?NewsId=564[/url]

"Dan Bishop" <d2bishop@engmail.uwaterloo.ca> wrote in message
news:398bf3d0.0406070452.389824e6@posting.google.c om...

> Hi,
>
> I have a DataGrid control that displays many records. As such, I have
> been given a requirement to contain only the body of my DataGrid
> control within <span> tags (this enables us to use a scroll bar to
> look through the records in the datagrid, instead of using paging).
>
> My problem is this: How can I get the header for the DataGrid to be
> displayed outside the <span>? I do not know if this is possible with
> the ASP.NET built-in DataGrid control, but I would be most interested
> in learning possible solutions... the current code that I am using is
> posted below. It shows the DataGrid entirely wrapped in the <span>,
> meaning that the Header is not visible once you scroll down a little
> bit...
>
> CODE:
> <span runat="server" id="dgSpan">
> <asp:DataGrid ID="dgIssueListing" GridLines="Both" BorderWidth="2px"
> CssClass="regularText" AutoGenerateColumns="False" AllowSorting="True"
> AllowPaging="False" ShowHeader="True"
> ShowFooter="False"Runat="server">
> <Columns>
> <asp:ButtonColumn ButtonType="LinkButton" CommandName="Select"
> Visible="False"></asp:ButtonColumn>
> <asp:TemplateColumn HeaderText="ID" SortExpression="issueID">
> <HeaderStyle HorizontalAlign="Center"></HeaderStyle>
> <ItemStyle HorizontalAlign="Center" Width="25px"></ItemStyle>
> <ItemTemplate>
> <asp:Label ID="lblIssueID" Width="25px" Text='<%#
> DataBinder.Eval(Container.DataItem, "issueID")%>' Runat="server"
> CssClass="regularText">
> </asp:Label>
> </ItemTemplate>
> </asp:TemplateColumn>
> <asp:BoundColumn HeaderText="Status" DataField="status"
> SortExpression="status" HeaderStyle-HorizontalAlign="Center"
> ItemStyle-HorizontalAlign="Center"
> ItemStyle-Width="45px"></asp:BoundColumn>
> <asp:BoundColumn HeaderText="Priority" DataField="priority"
> SortExpression="priority" HeaderStyle-HorizontalAlign="Center"
> ItemStyle-HorizontalAlign="Center"
> ItemStyle-Width="45px"></asp:BoundColumn>
> <asp:BoundColumn HeaderText="Task" DataField="taskDesc"
> SortExpression="taskDesc" ItemStyle-Width="120px"></asp:BoundColumn>
> <asp:BoundColumn HeaderText="Subject" DataField="issueSubj"
> SortExpression="issueSubj" ItemStyle-Width="275px"></asp:BoundColumn>
> </Columns>
> <HeaderStyle BackColor="Gray" ForeColor="White"
> Font-Bold="True"></HeaderStyle>
> </asp:DataGrid>
> </span>
>
> Many Thanks,
> -Dan Bishop