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

Design in the caption header of a grid on export

9 Answers 294 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Julio
Top achievements
Rank 1
Julio asked on 06 Feb 2013, 06:50 PM
First of all, pardon for my bad English, I'm using google translator.. =P

I have a question, Is it possible to give a design to a Radgrid caption header when exporting to Excel
For example, align to the left, size, bold, background-color, etc.          Not only to the MasterTableView, also the DetailTables.

I have tried to do this from the ItemCreated event, but unfortunately I could not do this.
Only worked for the header columns and data (GridHeaderItem, GridDataItem).

The caption header always appears centered and without background color.

How I can provide design to de caption header?
-----------------------------------------------------------------------
                        Caption Header
-----------------------------------------------------------------------
Header1    Header2    Header3    Header4
-----------------------------------------------------------------------
Data1        Data2        Data3        Data4

9 Answers, 1 is accepted

Sort by
0
Jayesh Goyani
Top achievements
Rank 2
answered on 07 Feb 2013, 12:49 PM
Hello,


protected void RadGrid1_GridExporting(object source, GridExportingArgs e)
   {
        
       string customHTML ="<div width=\"100%\" style=\"clear:both;text-align:center;font-size:12px;font-family:Verdana;\">" + "Caption name" + "</div>";
 
       e.ExportOutput = e.ExportOutput.Replace("<body>", String.Format("<body>{0}", customHTML));
   }
 
   protected void RadGrid1_PdfExporting(object sender, GridPdfExportingArgs e)
   {
       string customHTML = "<div width=\"100%\" style=\"clear:both;text-align:center;font-size:12px;font-family:Verdana;\">" + "Caption name" + "</div>";
 
       e.RawHTML = customHTML + e.RawHTML;
 
       string myClass = "th { text-align: left; }";
       string cssStyle = String.Format("<style type='text/css'>{0}</style>", myClass);
       e.RawHTML = e.RawHTML.Replace("<head>", "<head>" + cssStyle);
   }


Thanks,
Jayesh Goyani
0
Julio
Top achievements
Rank 1
answered on 07 Feb 2013, 04:20 PM

Hi Jayesh Goyani.

Thanks for your answer.

Your code actually allows me to add a caption header to the MasterTableView, but not the DetailTables.

I'm exporting the table with the option MasterTableView.HierarchyDefaultExpanded enabled.

I need to make something like this:
-------------------------------------------------------------------------------------------------
Caption Header of MasterTableView  (text-align:left,Bold,etc)
-------------------------------------------------------------------------------------------------
Header1 Header2 Header3 Header 4
Data1     Data2     Data3     Data4     
                         -----------------------------------------------------------------------------------------
                             Caption header of the first DetailTable  (text-align:left,Bold,etc)
                          -----------------------------------------------------------------------------------------
                             Header1     Header2     Header3 
                             Data1         Data2         Data3 
                           -----------------------------------------------------------------------------------------
                             Caption header of the secord DetailTable (text-align:left,Bold,etc)
                           -----------------------------------------------------------------------------------------
                             Header1     Header2     Header3     Header 4          
                             Data1         Data2          Data3      Data4      
 -----------------------------------------------------------------------------------------
Data1     Data2     Data3     Data4    

I need something that allows me to give desing to the caption headers of the DetailTables...   =(

Is
it really possible to do that?    =)

0
Eyup
Telerik team
answered on 11 Feb 2013, 12:23 PM
Hello Julio,

You can achieve the requested functionality by controlling the Caption property of GridTableView:
<MasterTableView ... Caption="<span style='font-style:italic; color:Red;'>TEXT</span>">

I hope this helps.

Greetings,
Eyup
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Julio
Top achievements
Rank 1
answered on 14 Feb 2013, 09:28 PM

Greetings Eyup. Thanks for your answer ...

With the code you gave me, I was able to format the header, but only the following properties:

- font-style:italic

- font-weight:bold

- font-size:1.7em

The background-color and text-align properties did not work. This is my code:

Dim color As String = ColorTranslator.ToHtml(RadColorPicker1.SelectedColor)
 RadGrid1.MasterTableView.Caption = "<span style='font-style:italic; font-weight:bold; font-size:1.7em; text-align:left; background-color:" + color + ";'>Inventario</span>"

This code is in the click event of a button to export.

Is there any way to give a background color and text alignment to the caption headers?

0
Eyup
Telerik team
answered on 20 Feb 2013, 07:09 AM
Hi Julio,

I am glad that the suggested approach was helpful.

To be able to use the text-align property, please replace the span element with div. Additionally, you can check out the following topic to alter the background-color of the exported cells:
http://www.telerik.com/help/aspnet-ajax/grid-html-export.html

Hope this helps.

Regards,
Eyup
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Julio
Top achievements
Rank 1
answered on 21 Feb 2013, 10:51 PM

Hi Eyup.  Thanks again for your help...

I put into practice your recommendation, to replace the span element with div. With this I was able to use the text-align property on the caption header.    But I could not give a background color to the caption header.

I examine the link you gave me, and do some testing. I came to the following conclusions:

1) With the "ExportCellFormatting" and "ItemCreated" events is not possible to give background color to the caption header.

2) Using the "HTMLExporting", I could do the following:
 
 -  With e.Styles.Append("body { background:blue;}") I was able to give a background color to the entire stylesheet. But I just need to give background color to the header.

 - With e.Styles.Append("table { background:blue;}") I was able to give background color to the entire table, but with the exception of the caption head.

 - With e.Styles.Append("tr { background:blue !important;}") and e.Styles.Append("td { background:blue !important;}") I was able to give background color to all rows, cells and headers of each column, but with the exception of the caption header. 

Does the "HTMLExporting"
event is the key to all this?

How could I give a background color to the caption header?

Regards.

0
Eyup
Telerik team
answered on 27 Feb 2013, 12:03 PM
Hi Julio,

Please note that this behavior is due to the parsing specifications of Excel. Therefore, try the following approach:
Caption="<div id='master' style='font-style:italic; color:DarkBlue; text-align:right; background-color:lightgreen''>Master Table</div>"
C#:
protected void RadGrid1_GridExporting(object sender, GridExportingArgs e)
{
    // set the colspan to your columns count
    e.ExportOutput = e.ExportOutput.Replace("<caption class=\"rgCaption\" ><div id='master'", "<tr><td colspan=\"4\"");
    e.ExportOutput = e.ExportOutput.Replace("</div></caption>", "</td></tr>");
}

Hope this helps. Give it a try and let me know about the result.

Additionally, please keep in mind that this approach is not fully tested and may cause unexpected harm to the grid structure.

All the best,
Eyup
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Anamarija
Top achievements
Rank 1
answered on 19 Sep 2014, 10:22 AM
What about RadTreeList ??
e.ExportOutput doesn't contain <body>, or it does, but is compressed format ?

e.ExportOutput = e.ExportOutput.Replace("<body>", String.Format("<body>{0}", customHTML));


0
Kostadin
Telerik team
answered on 24 Sep 2014, 08:39 AM
Hi Anamarija,

Note that TreeList export format differs from RadGrid default format which is based on Html. TreeList export format is a binary type which could not be modified.

Regards,
Kostadin
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Grid
Asked by
Julio
Top achievements
Rank 1
Answers by
Jayesh Goyani
Top achievements
Rank 2
Julio
Top achievements
Rank 1
Eyup
Telerik team
Anamarija
Top achievements
Rank 1
Kostadin
Telerik team
Share this question
or