ARTICLE

XYDataGrid in VB.NET

Posted by Yildirim Kocdag Articles | Visual Basic .NET September 22, 2012
XYDataGrid is a web datagrid control which helps to developers to put fixed headers and fixed columns.
Reader Level:
Download Files:
 

Datagrid-record-in-vb.net.jpg

Figure 1: XYDataGrid is a web datagrid control which helps to developers to put fix headers and fix columns.

One of the important business need is fixed headers and fixed columns for a datagrid component. However, it is not so easy for a web development team to add these functionalities to current datagrid control.

XYDatagrid offers you these methods to add and remove fixed columns and headers easily.

Using the code

Please add the below code after you add XYDataGrid as a reference to your project.

Dim constr As String

Dim dt As New System.Data.DataTable

Dim sql As String

constr = "Provider=Microsoft.Jet.OLEDB.4.0;
Data Source=c:\XYDataGridTestData.mdb;User Id=admin;Password=;"

Dim cn As New OleDbConnection(constr)

cn.Open()

sql = "Select * from XYDataGridTestTable"

Dim cmd As New OleDbCommand(sql, cn)

Dim da As New OleDbDataAdapter(cmd)

da.Fill(dt)

XYDataGrid1.DataSource = dt

XYDataGrid1.DataBind()

 

Another important code snippet is the code which should be added to design side.

 

<form id="form1" runat="server">

    <div>

    <DIV style="Z-INDEX: 101; LEFT: 0px; OVERFLOW: auto; WIDTH: 400px;
POSITION: relative; TOP: 46px; HEIGHT: 200px">

        <cc1:XYDataGrid ID="XYDataGrid1" runat="server" style="border-width:
1px;border-style:None;"
FixHeader="True" FixColumn="2">

                </cc1:XYDataGrid>&nbsp;

    </DIV>

    </div>

</form> 

 

After you set the properties as below the datagrid can be ready to work.
 

Datagrid-properties-setting-in-vb.net.jpg
 

Figure 2: Some Pictures from The XYDataGrid,

 

datagrid-show-record-in-vb.net.jpg
 

Figure 3: Ready to scroll down and right.

 

Scrolling-of-Datagrid-in-vb.net.jpg
 

Figure 4: After first scroll right, department column is sliding to left. Two columns which are ID and Name are fixed.


scroll-right-of-datagrid-in-vb.net.jpg
 

Figure 5: After birthday column is sliding to left.


column-birthday-slide-left-in-datagrid-in-vb.net.jpg
 

Figure 6: After scroll down, the first row is scroll up.


Datagrid-scroll-down-in-vb.net.jpg


Figure 7: After scroll down, the first rows are scroll up.

COMMENT USING

Trending up