We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

transpose rows and columns of datagrid

Thread ID:

Created:

Updated:

Platform:

Replies:

143553 Mar 26,2019 02:26 PM UTC Apr 2,2019 10:05 AM UTC WPF 4
loading
Tags: SfDataGrid
James Randle
Asked On March 26, 2019 02:26 PM UTC

Hi,
How do i change the orientation of the datagrid so the columns are down the left-hand side, rather than along the top.
This article demonstrates what I'm trying to achieve ... https://www.grapecity.com/en/blogs/4-steps-to-creating-an-inverted-datagrid.
Eg

Change

 |Column1|Column2|Column3|
1|Data1.1|Data1.2|Data1.3|
2|Data2.1|Data2.2|Data2.3|

to

       |1      |2      |3
Column1|Data1.1|Data2.1|Data3.1
Column2|Data1.2|Data2.2|Data3.2
Column3|Data1.3|Data2.3|Data3.3

Cheers,
James.

Deivaselvan Y [Syncfusion]
Replied On March 27, 2019 06:06 AM UTC

Hi James,

Thank you for using Syncfusion products.

You can refer the below article to change the orientation of the DataGrid and let us know if this helps you.

https://www.syncfusion.com/kb/2606/how-to-change-the-orientation-rotating-of-sfdatagrid

Regards,
Deivaselvan 


James Randle
Replied On March 27, 2019 10:58 AM UTC

Hi,
That helps, thanks!

Unfortunately though, all the columns are a fixed width, and some of my column's data is variable width, so some of the columns do not display the full data.
Eg

       |1      |2      |3      |
Column1|DATAOK |DATAOK |DATAOK |
Column2|DATAOK |DATAOK |DATAOK |
Column3|LONGDAT|LONGERD|LONGDAT|

should be

       |1       |2         |3       |
Column1|DATAOK  |DATAOK    |DATAOK  |
Column2|DATAOK  |DATAOK    |DATAOK  |
Column3|LONGDATA|LONGERDATA|LONGDATA|

How do i resize the columns so that the data is visible, depending on the length of the text?

Thanks again,
James.

Deivaselvan Y [Syncfusion]
Replied On March 28, 2019 05:02 PM UTC

Hi James, 

We have analyzed your query to resize the column width based on the data in transposed SfDataGrid. We are currently validating the feasibility to achieve your requirement and we will update you with more details on 1st April,2019. 

We will appreciate your patience until then. 

Regards, 
Deivaselvan 


Dinesh Babu Yadav [Syncfusion]
Replied On April 2, 2019 10:05 AM UTC

Hi James, 
 
Thanks for your patience. 
 
We have analyzed your query to auto fit the column based on the data in transposed SfDataGrid. And you can achieve this by using QueryRowHeight event and customizing the GridColumnSizer as like below code snippet 
 
this.datagrid.GridColumnSizer = new CustomerGridColumnSizer(); 
this.datagrid.QueryRowHeight += datagrid_QueryRowHeight; 
 
private void datagrid_QueryRowHeight(object sender, QueryRowHeightEventArgs e) 
        { 
            if (e.RowIndex > this.datagrid.GetHeaderIndex()) 
            { 
                e.Height = (this.datagrid.GridColumnSizer as CustomerGridColumnSizer).GetAutoRowWidth(e.RowIndex); 
                e.Handled = true; 
            } 
        } 
 
public class CustomerGridColumnSizer : GridColumnSizer 
    { 
        public double GetAutoRowWidth(int rowIndex) 
        { 
            var rowData = this.DataGrid.GetRecordAtRowIndex(rowIndex); 
            double autoWidth = double.NaN; 
            foreach(var col in this.DataGrid.Columns) 
            { 
                var width = GetAutoWidth(col,rowData); 
                if (double.IsNaN(autoWidth)) 
                    autoWidth = width; 
                else if (width > autoWidth) 
                    autoWidth = width; 
            } 
            return autoWidth; 
        } 
 
        public double GetAutoWidth(GridColumn column, object record) 
        { 
            var colIndex = this.DataGrid.Columns.IndexOf(column); 
            int scrollColumnIndex = this.DataGrid.ResolveToScrollColumnIndex(colIndex); 
            double colWidth = this.DataGrid.GetVisualContainer().ColumnWidths[scrollColumnIndex]; 
            double rowHeight = this.DataGrid.GetVisualContainer().RowHeights.DefaultLineSize; 
            double resultWidth = 0; 
            int stringLenth = 0; 
            object rowData = null; 
            var clientSize = new Size(colWidth, rowHeight); 
            if (record == null) 
               return 0; 
 
            if (column is GridTemplateColumn) 
            { 
                var textsize = this.GetCellSize(clientSize, column, record, GridQueryBounds.Width); 
                if (textsize.IsEmpty) 
                    return 0; 
                resultWidth = textsize.Width; 
            } 
            else 
            { 
                var text = this.GetDisplayText(column, record); 
                if (text.Length >= stringLenth) 
                { 
                    stringLenth = text.Length; 
                    rowData = record; 
                } 
            } 
 
            if (!(column is GridTemplateColumn)) 
            { 
                var textsize = this.GetCellSize(clientSize, column, record, GridQueryBounds.Width); 
                resultWidth = textsize.Width; 
            } 
            return Math.Round(resultWidth); 
        } 
    } 
 
Please find sample for the same from the below link 
 
 
Please let us know, if you need any further assistance on this. 
 
Regards,
Dinesh Babu Yadav 
 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon