win UI 3 - Load DataGrid from DataTable

Question

question

CJS-3133 asked 2 days ago Castorix31 answered 15 hours ago

win UI 3 - Load DataGrid from DataTable

Need some help getting DataTable data to display in a DataGrid. The code below works fine if I create a WPF app. When I run it in WinUI 3, I get "system.Data.DataView", etc, as seen in the screenshot following the code.

Any thoughts?

My xaml:

     <Window
         x:Class="SampleWINUIDataGrid.MainWindow"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:controls="using:CommunityToolkit.WinUI.UI.Controls"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:local="using:SampleWINUIDataGrid"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
         mc:Ignorable="d">
        
         <StackPanel Margin="20" HorizontalAlignment="Left">
             <controls:DataGrid x:Name="myDataGrid" AutoGenerateColumns="True" />
         </StackPanel>
        
     </Window>

My code behind:

 using Microsoft.UI.Xaml;
 using System.Data;
    
 namespace SampleWINUIDataGrid
 {
     public sealed partial class MainWindow : Window
     {
         public DataTable MyDataTable { get; set; }
         public MainWindow()
         {
             this.InitializeComponent();
    
             MyDataTable = new DataTable("table");
                
             MyDataTable.Columns.Add("name");
             MyDataTable.Columns.Add("age");
    
             MyDataTable.Rows.Add("aaa", "11");
             MyDataTable.Rows.Add("bbb", "22");
             MyDataTable.Rows.Add("ccc", "33");
    
             myDataGrid.ItemsSource = MyDataTable.DefaultView;
         }
     }
 }

My results:

windows-app-sdk

123.png (21.8 KiB)

· 1

5 |1600 characters needed characters left characters exceeded

Attachments: Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

CJS-3133 · 16 hours ago

UPDATE: Sorry, I should have been a bit more specific...

I am reading various CSV files into a DataTable, so I ultimately need the DataGrid to be 'dynamic'. I experimented a bit with ExpandoObjects, but could not get that to work.

0 ·

Answer 1 · 2022-05-14T20:34:01.853Z

Castorix31 answered 2 days ago CJS-3133 commented 16 hours ago

You can use x:Bind with a Collection

   <controls:DataGrid x:Name="myDataGrid" AutoGenerateColumns="True" Margin="10, 20, 0, 0"
                            ItemsSource="{x:Bind MyData}">

with :

         public class MyDataClass
         {
             public String Name { get; set; }
             public int Age { get; set; }
    
             public MyDataClass(String Name, int Age)
             {
                 this.Name = Name;
                 this.Age = Age;  
             }
         }
            
         System.Collections.ObjectModel.ObservableCollection<MyDataClass> MyData = new System.Collections.ObjectModel.ObservableCollection<MyDataClass>();

Test click Button :

         private void myButton_Click(object sender, RoutedEventArgs e)
         { 
             MyData.Add(new MyDataClass("aaa", 11));
             MyData.Add(new MyDataClass("bbb", 22));
             MyData.Add(new MyDataClass("ccc", 33));
         }

winui3-datagrid.gif (42.1 KiB)

· 1

5 |1600 characters needed characters left characters exceeded

Attachments: Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

CJS-3133 · 16 hours ago

Thanks for the info, but I'm not using a specific class to load the DataGrid. I need it to be 'dynamic', as my source of data is coming from CSV files that can change.

0 ·

Answer 2 · 2022-05-16T14:36:31.533Z

Castorix31 answered 15 hours ago

Another method by adding columns/data dynamically from your DataTable (with AutoGenerateColumns="False") =>

 <controls:DataGrid x:Name="myDataGrid" AutoGenerateColumns="False" VerticalAlignment="Top" Margin="10, 20, 0, 0" />

then

   public DataTable MyDataTable { get; set; }

and (add the "less than" character before object (editor bug...))

             MyDataTable.Columns.Add("Name");
             MyDataTable.Columns.Add("Age");
    
             MyDataTable.Rows.Add("aaa", "11");
             MyDataTable.Rows.Add("bbb", "22");
             MyDataTable.Rows.Add("ccc", "33");

             for (int i = 0; i < MyDataTable.Columns.Count; i++)
             {
                 myDataGrid.Columns.Add(new CommunityToolkit.WinUI.UI.Controls.DataGridTextColumn()
                 {
                     Header = MyDataTable.Columns[i].ColumnName,
                     Binding = new Binding { Path = new PropertyPath("[" + i.ToString() + "]") }
                 });
             }



             var collectionObjects = new System.Collections.ObjectModel.ObservableCollection object>();
             foreach (DataRow row in MyDataTable.Rows)
             {
                 collectionObjects.Add(row.ItemArray);
             }
             myDataGrid.ItemsSource = collectionObjects;

winui3-datagrid2.gif (51.1 KiB)

5 |1600 characters needed characters left characters exceeded

Attachments: Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

question