Scrolling

Hi,
I have a growing problem. I have VS2003 Web Application VB.Net using datagrid for data coming from SQL. Everyone must have scrolling no one wants paging. Everyone must have sorting.

The problem is the datagrid is getting longer and so I need to make the header "frozen" so the data at the bottom of the grid will display the header row. I have done this before by hiding the datagrid header and create a new header above the grid but that won't work this time because of the sorting.

Thanks for any help/suggestions
Donnie
LVL 12
Donnie4572Asked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

iboutchkineCommented:
Check this. It is scrollable datagrid with frozen header

HTML.
The idea is to make separate header and put it between div tags. Datagrid set headder to none

<%@ Page Language="vb" AutoEventWireup="false" Codebehind="ScrollDG.aspx.vb" Inherits="TestEverything.ScrollDG" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
      <HEAD>
            <title>ScrollDG</title>
            <meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
            <meta content="Visual Basic .NET 7.1" name="CODE_LANGUAGE">
            <meta content="JavaScript" name="vs_defaultClientScript">
            <meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
      </HEAD>
      <body MS_POSITIONING="GridLayout">
            <form id="Form1" method="post" runat="server">
                  <asp:Label id="Label1" runat="server" style="Z-INDEX: 103; LEFT: 112px; POSITION: absolute; TOP: 8px"
                        Font-Size="Large" Width="623px" Font-Bold="True" ForeColor="Red" BorderStyle="Solid">Example of scrollable datagrid with frozen header</asp:Label>
                  <asp:hyperlink id="Hyperlink2" style="Z-INDEX: 105; LEFT: 8px; POSITION: absolute; TOP: 8px" runat="server"
                        NavigateUrl="Controls.aspx">Controls</asp:hyperlink>
                  <br>
                  <br>
                  <br>
                  <br>
                  <div>
                        <table style="Z-INDEX: 101; LEFT: -9px; WIDTH: 707px; POSITION: relative; BORDER-COLLAPSE: collapse; HEIGHT: 26px"
                              cellSpacing="0" align="left" border="1">
                              <tr>
                                    <td align="center" width="195" bgColor="navy"><font face="Verdana" color="white" size="4"><b>YYYYMM
                                                </b></font>
                                    </td>
                                    <td align="center" width="195" bgColor="navy" style="WIDTH: 195px"><font face="Verdana" color="white" size="4"><b>Prod
                                                      ID</b></font>
                                    </td>
                                    <td align="center" width="300" bgColor="navy"><font face="Verdana" color="white" size="4"><b>Name</b></font>
                                    </td>
                              </tr>
                        </table>
                  </div>
                  <div style="Z-INDEX: 102; LEFT: 2px; VERTICAL-ALIGN: top; OVERFLOW: auto; WIDTH: 710px; POSITION: absolute; TOP: 100px; HEIGHT: 300px">
                        <asp:datagrid id="dg" runat="server" ShowHeader="False" AutoGenerateColumns="False" BorderColor="Black"
                              BorderWidth="1px">
                              <Columns>
                                    <asp:BoundColumn DataField="YYYYMM" HeaderText="YYYYMM">
                                          <ItemStyle HorizontalAlign="Center" Width="200px"></ItemStyle>
                                    </asp:BoundColumn>
                                    <asp:BoundColumn DataField="ProdID" HeaderText="ProdID">
                                          <ItemStyle HorizontalAlign="Center" Width="200px"></ItemStyle>
                                    </asp:BoundColumn>
                                    <asp:BoundColumn DataField="Name" HeaderText="Name">
                                          <ItemStyle HorizontalAlign="Center" Width="300px"></ItemStyle>
                                    </asp:BoundColumn>
                              </Columns>
                        </asp:datagrid></div>
            </form>
      </body>
</HTML>

=============================================
Code behind

Imports System.Data.OleDb

Public Class ScrollDG
    Inherits System.Web.UI.Page

#Region " Web Form Designer Generated Code "

    'This call is required by the Web Form Designer.
    <System.Diagnostics.DebuggerStepThrough()> Private Sub InitializeComponent()

    End Sub
    Protected WithEvents dg As System.Web.UI.WebControls.DataGrid
    Protected WithEvents Label1 As System.Web.UI.WebControls.Label
    Protected WithEvents Hyperlink2 As System.Web.UI.WebControls.HyperLink

    'NOTE: The following placeholder declaration is required by the Web Form Designer.
    'Do not delete or move it.
    Private designerPlaceholderDeclaration As System.Object

    Private Sub Page_Init(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Init
        'CODEGEN: This method call is required by the Web Form Designer
        'Do not modify it using the code editor.
        InitializeComponent()
    End Sub

#End Region
    Dim ds As New DataSet
   
    Dim fsConn As String = "Provider=Microsoft.Jet.OLEDB.4.0;" & _
             "Data Source=C:\TestDB\TestDB.mdb;"
    Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        'Put user code to initialize the page here
        FillDataSet()
        dg.DataSource = ds
        dg.DataBind()
    End Sub
    Sub FillDataSet()
        Dim sSQL As String
        sSQL = "select YYYYMM, ProdID, Name from PRQ"

        Dim cn As New OleDbConnection(fsConn)
        cn.Open()
        ' Fill the dataset ds
        Dim da As New OleDbDataAdapter(sSQL, cn)
        da.Fill(ds)
        cn.Close()
    End Sub

End Class
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Donnie4572Author Commented:
Thanks,
This is works for scrolling...frozen header. I don't see how to fit sorting into the code.

Im using the sortcommand event to sort which fires from the column header.

Private Sub mydatagrid_SortCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridSortCommandEventArgs) Handles mydatagrid.SortCommand
        mydatagrid.DataSource = mydataset1.mytable.DefaultView
        mydataset1.mytable.DefaultView.Sort = e.SortExpression
        mydatagrid.DataBind()

    End Sub

Thanks,
Donnie
0
Donnie4572Author Commented:
Any More Ideas?
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Visual Basic.NET

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.