DataBinding WPF

Here we look an example of simple data binding in WPF. In this example I use a class for Data Binding. Here we look at the program.

Step1: First we create a Grid in our project:

<Grid x:Name="StuInfo">

     <Grid.ColumnDefinitions>

          <ColumnDefinition Width="Auto" MinWidth="77"></ColumnDefinition>

          <ColumnDefinition></ColumnDefinition>

     </Grid.ColumnDefinitions>

     <Grid.RowDefinitions>

          <RowDefinition></RowDefinition>

          <RowDefinition></RowDefinition>

          <RowDefinition></RowDefinition>

          <RowDefinition></RowDefinition>

          <RowDefinition></RowDefinition>

     </Grid.RowDefinitions>

</Grid>

Step2: After that we create two TextBlocks and Two TextBoxes in our program and we also create a Button (Next) to see the Next Record according to the program.
 

<TextBlock Text="First Name" Margin="10"></TextBlock>

<TextBlock Text="Last Name" Margin="10" Grid.Row="1"></TextBlock>

<TextBox Text="{Binding fname}" Margin="10" Grid.Column="1"></TextBox>

<TextBox Text="{Binding lname}" Margin="10" Grid.Column="1"  Grid.Row="1"></TextBox>

<Button HorizontalAlignment="Left" Margin="0,12,0,9" Name="button1" Width="75"Grid.Column="1" Grid.Row="2">Next</Button>



Step3: Now we add a Loaded Event handler in the .cs page. This event will be called when the client wants to load the application:
 

public partial class Window1 : Window

{
   public Window1()

   {

        InitializeComponent();

        this.Loaded += new RoutedEventHandler(Page_Loaded);

   }

   void Page_Loaded(object sender, RoutedEventArgs e)

   {

   }

}

Step4: Now we add a class to our program:

public class Stu{
    public string fname { get; set; }
    public string lname { get; set; }
}  

Step5: Now we write the following code in the Loded Event Handler:
 

void Page_Loaded(object sender, RoutedEventArgs e)

{

   Stu s = new Stu();

    {

      s.fname = "Viji";

      s.lname = "Karg";

    };

      this.StuInfo.DataContext = s;

}

As we mention Binding in TextBox in .xaml page :
 

<TextBox Text="{Binding fname}" Margin="10" Grid.Column="1"></TextBox>

<TextBox Text="{Binding lname}" Margin="10" Grid.Column="1"  Grid.Row="1"></TextBox>

Step6: Now we add another Event Handler, which is for the Next Button:
 

public Window1()

{

   InitializeComponent();

   this.Loaded += new RoutedEventHandler(Page_Loaded);

   this.button1.Click += new RoutedEventHandler(button1_Click);

}
void button1_Click(object sender, RoutedEventArgs e)

{

   Stu s = new Stu();

    {

       s.fname = "Sid";

       s.lname = "hari";

    };

   this.StuInfo.DataContext = s;

}

Here we add another data in our program. When we click on the Next Button, the output will be: