How to Use BindingNavigator in F#

Introduction

This article explains the BindingNavigator Control and how to use this control in a Windows Forms application. I have used a BindingSource to retrieve the Data Source. For this article  I have used Visual Studio 2010 and SQL Server 2008.

BindingNavigator Control

A BindingNavigator control allows us to navigate and manipulate data on a form. It is a special purpose ToolStrip control for navigating and manipulating the controls on the forms.

  • Use the Top Button to get the first record of the table field.
  • Use the Prev Button to get he previous record of the table field.
  • Use the Next Button to get the next record of the table field.
  • Use the Bottom Button to get the last record of the table field.

Namespace: System.Windows.Forms

Syntax:

let navigationbind=new BindingNavigator(Dock=DockStyle.None) 

 

BindingSource

 

The BindingSource Property has the ability to access the the data source. The BindingSource property binds the Windows Forms control to the data source. The default property of the BindingSource class is DataSource.

 

Create Database & Tables

 

Create Database joining

use joining

CREATE TABLE [dbo].[EmployeeInfo](

      [UserId] [int] IDENTITY(1,1) NOT NULL,

      [UserName] [varchar](30) NULL,

      [FirstName] [varchar](30) NULL,

      [LastName] [varchar](30) NULL,

      [Address] [nvarchar](max) NULL,

      [City] [varchar](30) NULL

      )

To insert the values in the fields:

insert into EmployeeInfo values ('Pank','Pankaj','Lohani','a-43 santnagar','Delhi')

insert into EmployeeInfo values ('Nicks','Nimit','Joshi','Vinod Nagar','Delhi')

insert into EmployeeInfo values ('pr','pravesh','khanduri','pratap vihar','Delhi')

insert into EmployeeInfo values ('Nicks','Nimit','Joshi','Vinod Nagar','Delhi')

insert into EmployeeInfo values ('Ammu','Amit','Senwal','East Vinod Nagar','Delhi')

The following is the query to execute:

SELECT * FROM EmployeeInfo

Database.jpg

Now let's use the following procedure.

Step 1:

Open Visual Studio then select "Create New Project" --> "F# Console Application".

create-app.jpg

Step 2:

Now go the Solution Explorer on the right side of the application. Select the references and right-click on it and select "Add references".

selct-ref.jpg


add-ref.jpg

Step 3:

After selecting "Add References", in the framework template you need to select "System.Windows.Forms", "System.Data", "System.Data.SqlClient" and "System.Drawing" while holding down the Ctrl key and click on "Ok".

import-namespaces.jpg

Step 4:

Provide the following code for the F# application.

open System 

open System.Windows.Forms 

open System.Data 

open System.Data.SqlClient

open System.Drawing 

  

let constring = @"Data Source=MCNDESKTOP38;Initial Catalog=joining;User Id=sa; Password=Password$2"

let con = new SqlConnection(constring) 

let dataadpter=new SqlDataAdapter("Select * from EmployeeInfo", con) 

let ds = new DataSet()  

dataadpter.Fill(ds,"empInfo")|>ignore 

let navbuttonform = new Form(Text="Binding Database Table"

//creates User controls   

let lblId=new Label(Text="UserId:",Location=new System.Drawing.Point(0, 10),AutoSize=true

let lblfname=new Label(Text="Firstname:",Location=new System.Drawing.Point(0, 50),AutoSize=true

let lblLname=new Label(Text="Lastname:",Location=new System.Drawing.Point(0,100),AutoSize=true

let lblUname=new Label(Text="UserName:",Location=new System.Drawing.Point(0,150),AutoSize=true

let lblAddress=new Label(Text="Address:",Location=new System.Drawing.Point(0,200),AutoSize=true

let lblCity=new Label(Text="City:",Location=new System.Drawing.Point(0,250),AutoSize=true

let emplabel=new Label(Location=new System.Drawing.Point(100,10),BorderStyle=BorderStyle.FixedSingle) 

let fnamelabel=new Label(Location=new System.Drawing.Point(100,50),BorderStyle=BorderStyle.FixedSingle) 

let lnamelabel=new Label(Location=new System.Drawing.Point(100,100),BorderStyle=BorderStyle.FixedSingle)

let unamelabel=new Label(Location=new System.Drawing.Point(100,150),BorderStyle=BorderStyle.FixedSingle)

let addresslabel=new Label(Location=new System.Drawing.Point(100,200),BorderStyle=BorderStyle.FixedSingle)

let citylabel=new Label(Location=new System.Drawing.Point(100,250),BorderStyle=BorderStyle.FixedSingle) 

let bindsource=new BindingSource() 

//creates a binding navigator 

let navigationbind=new BindingNavigator(Dock=DockStyle.None,Location=new System.Drawing.Point(100, 300)) 

let movefirst=new ToolStripButton(Text="Top"

let moveprev=new ToolStripButton(Text="Prev"

let movenext=new ToolStripButton(Text="Next"

let movelast=new ToolStripButton(Text="Bottom"

let exitbutton=new ToolStripButton(Text="Exit"

navigationbind.Items.Add(movefirst)|>ignore 

navigationbind.Items.Add(moveprev)|>ignore 

navigationbind.Items.Add(movenext)|>ignore 

navigationbind.Items.Add(movelast)|>ignore 

navigationbind.Items.Add(exitbutton)|>ignore 

//funtions for the each navigational

navigationbind.MoveFirstItem<-movefirst 

navigationbind.MoveNextItem<-movenext 

navigationbind.MovePreviousItem<-moveprev 

navigationbind.MoveLastItem<-movelast 

exitbutton.Click.Add(fun exit->  

                    navbuttonform.Close() 

                    con.Close())   

bindsource.DataSource<-ds  

bindsource.DataMember<-"empInfo"  

navigationbind.BindingSource<-bindsource   

con.Open()   

//Binding UserControl

navbuttonform.Controls.Add(lblId) 

navbuttonform.Controls.Add(lblfname) 

navbuttonform.Controls.Add(lblLname) 

navbuttonform.Controls.Add(emplabel) 

navbuttonform.Controls.Add(fnamelabel) 

navbuttonform.Controls.Add(lnamelabel)

navbuttonform.Controls.Add(lblUname)

navbuttonform.Controls.Add(lblAddress)

navbuttonform.Controls.Add(lblCity)

navbuttonform.Controls.Add(unamelabel)

navbuttonform.Controls.Add(addresslabel)

navbuttonform.Controls.Add(citylabel)

navbuttonform.Controls.Add(navigationbind)  

emplabel.DataBindings.Add(new Binding("Text",bindsource,"UserId")) 

fnamelabel.DataBindings.Add(new Binding("Text",bindsource,"FirstName")) 

lnamelabel.DataBindings.Add(new Binding("Text",bindsource,"LastName")) 

unamelabel.DataBindings.Add(new Binding("Text",bindsource,"UserName")) 

addresslabel.DataBindings.Add(new Binding("Text",bindsource,"Address")) 

citylabel.DataBindings.Add(new Binding("Text",bindsource,"City")) 

navbuttonform.Show() 

Application.Run(navbuttonform)

 

Step 5:

Debug the application by pressing F5 and the result would be shown in the application as in the following figure.

after-debug.jpg

Step 6:

Click on the "Next" button; you'll get the next record of the table from the datbase.

NextButton.jpg

Step 7:

Click on the "Bottom" button; you'll get the last record of the table from the datbase.

BottomButton.jpg

Step 8:

Click on the "Previous" button; you'll get the previous record of the table from the datbase.

PreviousButton.jpg

Step 9:

If you want to see the first record of the table again then just click on the "Top" Button.

TopButton.jpg