MVVM - Apply Parameters from the ViewModel

• Apr 26, 2024
• 2 minutes to read

The DevExpress MVVM Framework allows you to bind the DocumentPreviewControl to a report in a ViewModel. The ViewModel instantiates a report and specifies report parameters. Parameter values are obtained from the ViewModel properties bound to View elements.

In this example, the GridControl component lists employees. The selected row identifies the employee, whose ID is passed as a parameter to the report displayed in a separate window.

The following code demonstrates bindings in XAML:

MainWindow.xaml

<dx:ThemedWindow x:Class="PassDataFromViewModelToReport.MainWindow"
                 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 xmlns:dxmvvm="http://schemas.devexpress.com/winfx/2008/xaml/mvvm"
                 xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core"
                 xmlns:dxp="http://schemas.devexpress.com/winfx/2008/xaml/printing"
                 xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid"
                 xmlns:models="clr-namespace:PassDataFromViewModelToReport.Models"
                 Title="MainWindow" Height="450" Width="800">
    <dx:ThemedWindow.DataContext>
        <models:MainViewModel />
    </dx:ThemedWindow.DataContext>

    <dxmvvm:Interaction.Behaviors>
        <dx:DialogService>
            <dx:DialogService.ViewTemplate>
                <DataTemplate>
                    <dxp:DocumentPreviewControl RequestDocumentCreation="True"
                                                DocumentSource="{Binding Report}" />
                </DataTemplate>
            </dx:DialogService.ViewTemplate>
        </dx:DialogService>
    </dxmvvm:Interaction.Behaviors>

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="auto" />
        </Grid.RowDefinitions>
        <dxg:GridControl ItemsSource="{Binding Employees}"
                         SelectedItem="{Binding SelectedEmployee, Mode=TwoWay}"
                         SelectionMode="Row"
                         AutoGenerateColumns="AddNew"
                         Margin="12,12,12,0">
            <dxg:GridControl.View>
                <dxg:TableView AllowEditing="False" />
            </dxg:GridControl.View>
        </dxg:GridControl>
        <Button Content="Show Preview" Command="{Binding ShowPrintPreviewCommand}" 
                Grid.Row="1" Margin="12" />
    </Grid>
</dx:ThemedWindow>

The ShowPrintPreviewCommand is defined in the ViewModel class. The command instantiates a report, assigns the SelectedEmployee value to the report parameter, and uses the DevExpress.Mvvm.IDialogService to open a report in a modal window:

C#

using DevExpress.Mvvm;
using DevExpress.Mvvm.DataAnnotations;
using DevExpress.XtraReports.UI;
using System.Collections.Generic;
using System.Data.Entity;

namespace PassDataFromViewModelToReport.Models {
    public class MainViewModel : ViewModelBase {
        readonly Data.NWindDBContext dbContext = new Data.NWindDBContext();

        public IEnumerable<Data.Employee> Employees { get; }

        public Data.Employee SelectedEmployee {
            get => GetProperty(() => SelectedEmployee);
            set => SetProperty(() => SelectedEmployee, value);
        }

        public MainViewModel() {
            dbContext.Employees.Load();
            Employees = dbContext.Employees.Local;
        }

        [Command(CanExecuteMethodName = nameof(CanShowPrintPreview))]
        public void ShowPrintPreview() {
            XtraReport report = new EmployeeReport(dbContext);
            report.Parameters["EmployeeId"].Value = SelectedEmployee.EmployeeID;
            using(report) {
                GetService<IDialogService>()
                    .ShowDialog(null, "Print Preview", new DocumentPreviewViewModel(report));
            }
        }
        public bool CanShowPrintPreview() => SelectedEmployee != null;
    }
}

VB.NET

Imports DevExpress.Mvvm
Imports DevExpress.Mvvm.DataAnnotations
Imports DevExpress.XtraReports.UI
Imports System.Collections.Generic
Imports System.Data.Entity

Namespace PassDataFromViewModelToReport.Models
    Public Class MainViewModel
        Inherits ViewModelBase

        Private ReadOnly dbContext As New Data.NWindDBContext()

        Public ReadOnly Property Employees() As IEnumerable(Of Data.Employee)

        Public Property SelectedEmployee As Data.Employee
            Get
                Return GetProperty(Function() SelectedEmployee)
            End Get
            Set(ByVal value As Data.Employee)
                SetProperty(Function() SelectedEmployee, value)
            End Set
        End Property

        Public Sub New()
            dbContext.Employees.Load()
            Employees = dbContext.Employees.Local
        End Sub

        <Command(CanExecuteMethodName := nameof(CanShowPrintPreview))>
        Public Sub ShowPrintPreview()
            Dim report As XtraReport = New EmployeeReport(dbContext)
            report.Parameters("EmployeeId").Value = SelectedEmployee.EmployeeID
            Using report
                GetService(Of IDialogService)().ShowDialog(New MessageButton(), "Print Preview", New DocumentPreviewViewModel(report))
            End Using
        End Sub
        Public Function CanShowPrintPreview() As Boolean
            Return SelectedEmployee IsNot Nothing
        End Function
    End Class
End Namespace

For more information on auto-generated commands, review the following help topic: POCO Commands.

The application appears as follows:

View Example: How to Use ViewModel Data as Report Parameters in WPF MVVM Application