Beginner - WPF DataGrid - How to Format Mult Rows in each Row?

Question

4.00/5 (1 vote)

See more:

VS2010

I am new to C#, WPF and VS. I am converting a VBA application to C#.
How do I create a DataGrid with multiple rows within each DataGrid Row formatted?
I can't seem to find out how anywhere.

See attached sample of what I am converting.
Woops can't see how to attach anything so see below.

Screen is like this:

Client Details Area as follows
----------------------------------------------------------------------
Name: xxxxxxxxx  Country: xxxxxxx
Ph: xxxxxx Fax: xxxxxx

etc.etc.
----------------------------------------------------------------------
Tab1 | Tab2 | Address Tab | etc. (this is Tab Selector)
=======================================
Address Lines City etc. (this is Data Grid Header)
=======================================
Adr1: Level 10, Unit 120--------Sydney
Adr2: 30 Thingy Lane
Adr3: xxxxxxxxxxx   
--------------------------------------------------------------

The above is one row of the data grid. Here would be the second row.

I hope you understand what I am getting at.

Posted 6-Mar-12 3:41am

MyPortMan

Updated 7-Mar-12 16:52pm

Chris Maunder772.7K

v4

Add a Solution

Comments

Ed Nutting 6-Mar-12 14:58pm

Why not just put new line breaks in the text (as you have above) then set the value of the cell to that - the GridView should then display an extra-big (high) row with the data split as per your line breaks giving the illusion of rows within a row (but really we know it's separate lines of text in a cell). - This also makes it easier for copying the whole address in one go without any data format issues.

Hope this helps,
Ed

Wonde Tadesse 7-Mar-12 22:24pm

TechSurf wrote:
Ed, Thankyou for your input.
However, What I had included was only a small example. In reality each DataGrid row will contain as many as 7 seperate lines (rows) with up to 7 fields in each row and each of different types such as combow boxes, list boxes, text boxes, etc.
Your solution would not work for thsi.

Ed Nutting 8-Mar-12 2:24am

Ahh... okay fair enough. Best to go with Clifford Nelson suggestions then :) Good luck!
Ed

2 solutions

Solution 1

The easiest thing would be to use a ListView. The following is a link to an article on using it:

http://www.switchonthecode.com/tutorials/wpf-tutorial-using-the-listview-part-1[^]

It is also possible to use a ListBox, but then you need a DataTemplate, and there would be no headers unless you manually created them.

[EDITED @ Mar 7, 2012 10:25 PM]

I understand your misgivings. I have worked extensively with the Infragistics XmlDataGrid, and it can use reflection to configure the grid form the ViewModel. The disadvantage is that then, if there are other properties that are not to be displayed, must manually fix, and if there is some customization of a cell, and then also have to manually configure. Still the ListView is better than the ListBox since it provides better support for a grid view, providing column headers, among other things. Still I have used the ListBox more than anything else. Obviously the Infragistics solution requires paying for the rights to use the gird. There is also the WPF DataGrid, see WPF DataGrid Practical Examples[^]

Posted 6-Mar-12 10:06am

Clifford Nelson

Updated 7-Mar-12 16:28pm

v2

Comments

MyPortMan 7-Mar-12 1:03am

Clifford, Thanks for your input also. This is closer to what I was looking for. However, It seems to me that by doing this I would be reinventing the wheel. I have a strong belief that if there is a way to utiliose either any existing tool or code that has been developed and proven by another then this should occur.

Having said this to-date I have not found a solution. So I will try your suggestion and see how it turns out. I will let you know how it goes.

Ideally, the datagrid should enable a grid to be constructed within each row so that we could position anything in any location we wanted and on any line withing the DataGrid.

Wonde Tadesse 7-Mar-12 22:30pm

5+

Ed Nutting 8-Mar-12 2:25am

My 5+ :)

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Clifford Nelson · Accepted Answer · 2012-03-07T17:01:00

Added this since it is a significant addition to ListView. ListView supports complex cell content. Have a sample here:

<window x:class="WpfApplication1.MainWindow" xmlns:x="#unknown">
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <grid>
    <listview>
      <listview.view>
        <gridview>
          <gridviewcolumn width="120" header="Date">
            <gridviewcolumn.celltemplate>
              <datatemplate>
                <stackpanel>
                  <checkbox />
                </stackpanel>
              </datatemplate>
            </gridviewcolumn.celltemplate>
          </gridviewcolumn>
          <gridviewcolumn width="120" header="Day Of Week">
            DisplayMemberBinding="{Binding DayOfWeek}" />
          <gridviewcolumn width="120" header="Year">
           DisplayMemberBinding="{Binding Year}" />
        </gridviewcolumn></gridviewcolumn></gridview>
      </listview.view>
    </listview>
  </grid>
</window>

As you can see the ListView GridViewColumn suports a template content. Here I only put a CheckBox inside, but since I put this in a StackPanel, easily add more inside the Stackpanel (make it a Grid if that is better). Depends on the content you want. May or may not help.