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

RadEditor content from HTML Table

4 Answers 168 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Dan
Top achievements
Rank 1
Dan asked on 31 Jan 2012, 05:22 PM
Hi,
We are writing a new version of our software using C# and Telerik tools.  In this case we have HTML content stored in the database that is being migrated and read into a RadEditor.  The issue seems to be when the content was created as a HTML Table.  Is there   An example is below:

<TABLE style="WIDTH: 503pt; BORDER-COLLAPSE: collapse" cellSpacing=0 cellPadding=0 width=670 border=0 x:str>
<COLGROUP>
<COL style="WIDTH: 34pt; mso-width-source: userset; mso-width-alt: 1645" width=45>
<COL style="WIDTH: 469pt; mso-width-source: userset; mso-width-alt: 22857" width=625>
<TBODY>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl26 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; WIDTH: 503pt; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent; mso-ignore: colspan" width=670 colSpan=2 height=17><STRONG><FONT face=Arial size=2>Roof Inspection, 1 
  
Year:</FONT></STRONG></TD></TR>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl25 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent" height=17><STRONG><FONT face=Arial size=2></FONT></STRONG></TD>
<TD class=xl24 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; BACKGROUND-COLOR: 
  
transparent"><STRONG><FONT face=Arial size=2></FONT></STRONG></TD></TR>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl25 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent" height=17><STRONG><FONT face=Arial size=2></FONT></STRONG></TD>
<TD class=xl24 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; BACKGROUND-COLOR: 
  
transparent"><STRONG><FONT face=Arial size=2></FONT></STRONG></TD></TR>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl27 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent; mso-ignore: colspan" colSpan=2 height=17><FONT face=Arial size=2>Note: Use caution whenever working on a 
  
roof.<SPAN style="mso-spacerun: yes">  </SPAN>Ensure all fall arrest procedures are followed.</FONT></TD></TR>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl25 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent" height=17><FONT face=Arial size=2></FONT></TD>
<TD class=xl24 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; BACKGROUND-COLOR: 
  
transparent"><FONT face=Arial size=2></FONT></TD></TR>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl27 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent" height=17 x:str="( ) "><FONT size=2><FONT face=Arial>( )<SPAN style="mso-spacerun: 
  
yes"> </SPAN></FONT></FONT></TD>
<TD class=xl24 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; BACKGROUND-COLOR: 
  
transparent"><FONT face=Arial size=2>Ensure the roof area is clean and free of debris, nails, scraps of metal and plant growth on the 
  
roof.</FONT></TD></TR>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl27 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent; mso-ignore: colspan" colSpan=2 height=17 x:str="( ) Examine metal flashings, cappings, and metal siding for 
  
wind damage, corrosion, loose "><FONT size=2><FONT face=Arial>( ) Examine metal flashings, cappings, and metal siding for wind damage, 
  
corrosion, loose<SPAN style="mso-spacerun: yes"> </SPAN></FONT></FONT></TD></TR>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl27 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent; mso-ignore: colspan" colSpan=2 height=17><FONT face=Arial size=2>joints or defective caulking.</FONT></TD></TR>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl27 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent; mso-ignore: colspan" colSpan=2 height=17><FONT face=Arial size=2>( ) Check pitch pockets and machinery bases 
  
for damage.</FONT></TD></TR>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl27 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent; mso-ignore: colspan" colSpan=2 height=17><FONT face=Arial size=2>( ) Examine roof surface for deterioration, 
  
water infiltration, or cracking.</FONT></TD></TR>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl27 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent; mso-ignore: colspan" colSpan=2 height=17><FONT face=Arial size=2>( ) Check that all roof drains are 
  
clear.</FONT></TD></TR>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl27 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent; mso-ignore: colspan" colSpan=2 height=17><FONT face=Arial size=2>( ) Check for poor drainage.</FONT></TD></TR>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl27 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent; mso-ignore: colspan" colSpan=2 height=17><FONT face=Arial size=2>( ) Check all roof anchors.</FONT></TD></TR>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl27 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent; mso-ignore: colspan" colSpan=2 height=17><FONT face=Arial size=2>( ) Check parapets for open mortar joints, 
  
capping.</FONT></TD></TR>
<TR style="HEIGHT: 12.75pt" height=17>
<TD class=xl27 style="BORDER-RIGHT: #c0c0c0; BORDER-TOP: #c0c0c0; BORDER-LEFT: #c0c0c0; BORDER-BOTTOM: #c0c0c0; HEIGHT: 12.75pt; 
  
BACKGROUND-COLOR: transparent; mso-ignore: colspan" colSpan=2 height=17><FONT face=Arial size=2>( ) Check all skylights for cracks, damaged 
  
flashing or caulking.</FONT></TD></TR></TBODY></TABLE>

When this is put into a htm file, it looks fine, but in the editor it looks like the attached Roof Inspection.jpg file.

The Editor (leaving out Tools and Modules) is defined as below:

<telerik:RadEditor ID="DescriptionEditor" Runat="server" 
                    Width="650px" Height="355px"
                    EditModes="Design, Preview"
                    EnableResize="false"
                    StripFormattingOnPaste="All" 
                    SkinID="DefaultSetOfTools"
                    OnClientCommandExecuting="OnClientCommandExecuting" 
                    >

Thanks for your help,
Dan Norton

4 Answers, 1 is accepted

Sort by
0
Accepted
Rumen
Telerik team
answered on 01 Feb 2012, 09:20 AM
Hello,

Please, set the CssFiles property to point to some empty css file and test the table content again.
You can find more information how to solve this CSS problem in the following article: Content Area Appearance Problems.

All the best,
Rumen
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
Dan
Top achievements
Rank 1
answered on 01 Feb 2012, 04:32 PM
Thanks Rumen,
That did the trick.  I pointed the ContentAreaCssFile to an empty css file and it cleared up the format issue completely.
Thanks again for your help,
Dan
0
Ramkumar
Top achievements
Rank 1
answered on 09 Dec 2013, 12:55 PM
Hi,
   I need to place the table inside the radeditor content in code behind. I can able to give the table inside the content property of radeditor.
But I need to do the same in code behing in C#. can anyone help me?
0
Marin Bratanov
Telerik team
answered on 11 Dec 2013, 06:06 PM
Hi Ramkumar,

You can use the server-side Content property RadEditor offers. It lets you get or set the current HTML string that is shown in RadEditor. You can create the tables as desired and insert them in the content.


Regards,
Marin Bratanov
Telerik
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 the blog feed now.
Tags
Editor
Asked by
Dan
Top achievements
Rank 1
Answers by
Rumen
Telerik team
Dan
Top achievements
Rank 1
Ramkumar
Top achievements
Rank 1
Marin Bratanov
Telerik team
Share this question
or