RadDataForm and RadGridView integration - popup editing.

Thursday, March 24, 2011 by Pavel Pavlov | Comments 1

 

Often collection data is better presented in a tabular view and better edited in a form view. Such UX approach is referred by our clients as “Popup editing in RadGridView”.

With the help of the new RadDataForm and the good old RadGridView a few lines of code are needed to accomplish this.

popupEditingInRadGridView

To have this working we need to :

1. Bind RadGridView to a collection IEditable and INotifyPropertyChange objects.

this.RadGridView1.ItemsSource = Person.GetSampleListOfPersons();

2. Bind a RadDataForm  to the current item of RadGridView

 

 <telerik:RadDataForm CurrentItem="{Binding CurrentItem,ElementName=RadGridView1}" …
 

3. Handle  the button event to show RadDataForm when needed.

 

private void Edit_Click(object sender, RoutedEventArgs e)
        {
            this.RadGridView1.CurrentItem = ((Button)sender).DataContext;
            this.RadDataForm1.Visibility = Visibility.Visible;
            this.RadDataForm1.BeginEdit();
        }


4.Handle the EditEnded event of RadDataform to hide it when no more needed.

 

void RadDataForm1_EditEnded(object sender, Telerik.Windows.Controls.Data.DataForm.EditEndedEventArgs e)
    {
        this.RadDataForm1.Visibility = Visibility.Collapsed;
    }
 

That is all you need to have  popup editing in RadGridView .

 

The full source code and a demo app  may be downloaded

1 Comments

  • Peter 23 Jul 2011
    Really good demo
    But how would one add rows to this using a button on the form (not in grid... this would not work if the grid is empty)
    At current the popup can not be moved with the mouse, will this be added to future versions

Add comment

  1. Formatting options
       
     
     
     
     
       
  2. (optional, emails won't be shown on public pages)
  3. (optional)