This is a migrated thread and some comments may be shown as answers.

HtmlViewDefinition of the RadGridView

3 Answers 132 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Ludovic
Top achievements
Rank 2
Ludovic asked on 13 Jan 2012, 04:18 AM
Hello,

I am trying to divide the column header of some columns in two with the HtmlViewDefinition of the RadGridView. My table is not so complex for the moment but I just can't make it work....

I attached an Excel file screenshot to this message so you can have a look to what I want to do and below is the code I wrote so far:

radGridViewSaleReport.DataSource = myList; //binding list
 
 
HtmlViewDefinition view = new HtmlViewDefinition();
 
view.RowTemplate.Rows.Add(new RowDefinition());
view.RowTemplate.Rows.Add(new RowDefinition());
view.RowTemplate.Rows[0].Cells.Add(new CellDefinition("Customer Name"));
view.RowTemplate.Rows[0].Cells.Add(new CellDefinition("Unit"));
view.RowTemplate.Rows[0].Cells.Add(new CellDefinition("Unit Type"));
view.RowTemplate.Rows[0].Cells.Add(new CellDefinition("Unit Area"));
view.RowTemplate.Rows[0].Cells.Add(new CellDefinition("Price/Sq.M."));
view.RowTemplate.Rows[0].Cells.Add(new CellDefinition("Selling Price"));
view.RowTemplate.Rows[0].Cells.Add(new CellDefinition("Initial booking"));
view.RowTemplate.Rows[0].Cells.Add(new CellDefinition("Booking"));
view.RowTemplate.Rows[0].Cells.Add(new CellDefinition("Signing Contract"));
view.RowTemplate.Rows[0].Cells.Add(new CellDefinition("Contract signed"));
view.RowTemplate.Rows[0].Cells.Add(new CellDefinition("Transfer"));
view.RowTemplate.Rows[0].Cells.Add(new CellDefinition("Sale"));
view.RowTemplate.Rows[0].Cells.Add(new CellDefinition("Comment"));
view.RowTemplate.Rows[1].Cells.Add(new CellDefinition("Amount"));
view.RowTemplate.Rows[1].Cells.Add(new CellDefinition("Date"));
view.RowTemplate.Rows[1].Cells.Add(new CellDefinition("Amount"));
view.RowTemplate.Rows[1].Cells.Add(new CellDefinition("Date"));
view.RowTemplate.Rows[1].Cells.Add(new CellDefinition("Amount"));
view.RowTemplate.Rows[1].Cells.Add(new CellDefinition("Date"));
view.RowTemplate.Rows[1].Cells.Add(new CellDefinition("Amount"));
view.RowTemplate.Rows[1].Cells.Add(new CellDefinition("Date"));
 
view.RowTemplate.Rows[0].Cells[0].RowSpan = 2;
view.RowTemplate.Rows[0].Cells[1].RowSpan = 2;
view.RowTemplate.Rows[0].Cells[2].RowSpan = 2;
view.RowTemplate.Rows[0].Cells[3].RowSpan = 2;
view.RowTemplate.Rows[0].Cells[4].RowSpan = 2;
view.RowTemplate.Rows[0].Cells[5].RowSpan = 2;
view.RowTemplate.Rows[0].Cells[9].RowSpan = 2;
view.RowTemplate.Rows[0].Cells[11].RowSpan = 2;
view.RowTemplate.Rows[0].Cells[12].RowSpan = 2;
view.RowTemplate.Rows[0].Cells[6].ColSpan = 2;
view.RowTemplate.Rows[0].Cells[7].ColSpan = 2;
view.RowTemplate.Rows[0].Cells[8].ColSpan = 2;
view.RowTemplate.Rows[0].Cells[10].ColSpan = 2;
 
radGridViewSaleReport.Update();
this.radGridViewSaleReport.ViewDefinition = view;
this.radGridViewSaleReport.TableElement.CellSpacing = -1;
this.radGridViewSaleReport.TableElement.RowSpacing = -1;

I have a binding list full of data in it which I give to the radgridview and then I define the view and apply the view to the radgridview after updating it.

With this code, the radgridview look like the screenshot radgridview result.

Any idea how to display the data correctly into the radgridview?

Thanks,
LB

3 Answers, 1 is accepted

Sort by
0
Accepted
Jack
Telerik team
answered on 17 Jan 2012, 10:58 AM
Hi Ludovic,

Thank you for contacting us.

Please note that RadGridView should contain columns for all cells represented in the view definition. So, you have to add columns first. There is a restriction in RadGridView which says that all columns should have unique name, so you have to change names of Date and Amount columns. You should use the HeaderText property of GridViewColumn to customize the header cell text.

When using HtmlViewDefinition, RadGridView repeats the header layout in all rows. So, you may prefer the ColumnGroupsViewDefinition instead. If this is the case, you can use the following code:
ColumnGroupsViewDefinition view = new ColumnGroupsViewDefinition();
 
AddColumnWithoutHeader(view.ColumnGroups, this.radGridView1.Columns["Customer Name"]);
AddColumnWithoutHeader(view.ColumnGroups, this.radGridView1.Columns["Unit"]);
AddColumnWithoutHeader(view.ColumnGroups, this.radGridView1.Columns["Unit Type"]);
AddColumnWithoutHeader(view.ColumnGroups, this.radGridView1.Columns["Unit Area"]);
 
view.ColumnGroups.Add(new GridViewColumnGroup("Initial Booking"));
view.ColumnGroups[4].Rows.Add(new GridViewColumnGroupRow());
view.ColumnGroups[4].Rows[0].Columns.Add(this.radGridView1.Columns["Amount1"]);
view.ColumnGroups[4].Rows[0].Columns.Add(this.radGridView1.Columns["Date1"]);
 
view.ColumnGroups.Add(new GridViewColumnGroup("Booking"));
view.ColumnGroups[5].Rows.Add(new GridViewColumnGroupRow());
view.ColumnGroups[5].Rows[0].Columns.Add(this.radGridView1.Columns["Amount2"]);
view.ColumnGroups[5].Rows[0].Columns.Add(this.radGridView1.Columns["Date2"]);
 
view.ColumnGroups.Add(new GridViewColumnGroup("Contract signing"));
view.ColumnGroups[6].Rows.Add(new GridViewColumnGroupRow());
view.ColumnGroups[6].Rows[0].Columns.Add(this.radGridView1.Columns["Amount3"]);
view.ColumnGroups[6].Rows[0].Columns.Add(this.radGridView1.Columns["Date3"]);
 
AddColumnWithoutHeader(view.ColumnGroups, this.radGridView1.Columns["Contract_signed"]);
 
view.ColumnGroups.Add(new GridViewColumnGroup("Transfer"));
view.ColumnGroups[8].Rows.Add(new GridViewColumnGroupRow());
view.ColumnGroups[8].Rows[0].Columns.Add(this.radGridView1.Columns["Amount4"]);
view.ColumnGroups[8].Rows[0].Columns.Add(this.radGridView1.Columns["Date4"]);
 
AddColumnWithoutHeader(view.ColumnGroups, this.radGridView1.Columns["Sale"]);
AddColumnWithoutHeader(view.ColumnGroups, this.radGridView1.Columns["Comment"]);
 
this.radGridView1.ViewDefinition = view;
 
void AddColumnWithoutHeader(ColumnGroupCollection columnGroups, GridViewColumn column)
{
    columnGroups.Add(new GridViewColumnGroup(column.Name));
    int i = columnGroups.Count - 1;
    if (i < 0) i = 0;
    columnGroups[i].ShowHeader = false;
    columnGroups[i].Rows.Add(new GridViewColumnGroupRow());
    columnGroups[i].Rows[0].Columns.Add((GridViewDataColumn)column);
}

I hope this helps. If you need further assistance, do not hesitate to write back.
 
Greetings,
Jack
the Telerik team

SP1 of Q3’11 of RadControls for WinForms is available for download (see what's new).

0
Ludovic
Top achievements
Rank 2
answered on 18 Jan 2012, 04:18 AM
Hi Jack,

Thank you for your answer. I made it work in 2 minutes!

I was focusing on the view and wondering why it did not work. I created before HtmlViewDefinition and ColumnGroupsViewDefinition similar to what I posted but could not find out why it did not work. Actually I forgot to add the columns before applying the view.

Thanks again! I will create a more complex view now to fit what I want to do.
LB

PS: I am just starting to use Telerik, hopefully soon I will understand how everything works.
0
Jack
Telerik team
answered on 20 Jan 2012, 02:34 PM
Hi Ludovic,

Thank you for this update. I am glad to hear that I could help. Please, do not hesitate to contact us if you need further assistance.
 
Greetings,
Jack
the Telerik team

SP1 of Q3’11 of RadControls for WinForms is available for download (see what's new).

Tags
General Discussions
Asked by
Ludovic
Top achievements
Rank 2
Answers by
Jack
Telerik team
Ludovic
Top achievements
Rank 2
Share this question
or