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

Issue with RadEditor as it adds extra space to original html cotent pasted from word

16 Answers 315 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Pbu
Top achievements
Rank 1
Pbu asked on 17 May 2013, 09:43 AM

Hi,

We are actually an existing customer of Telerik. We had  bought ASP.NET Ajax control from you.

Now we are out of the support period, yet we are using your controls to good effect.

We are facing with the occurrence of unwanted spaces in the mails sent to outlook. This happens when we paste HTML content from MSWord to  RAD Editor control with spell check enabled. The content looks normal in the editor but when we send the mail after spell check, the content got delivered successfully to Outlook but the format becomes weird as compared to the original content. Below is the sample html which got added with unwanted space once it got sent from RAD Editor.

We want to know if there is any work  around to sort this out so that the email looks the same as how the content pasted into RAD Editor?

We are having an email application using the RAD Editor control and since we are facing with lots of inconvenience. we appreciate your help from your end. Could you please look into our issue and help us?

Many Thanks,

Prabhu.

ORIGINAL HTML CONTENT

What's going on in 2013?


Many customers have been installing Visual Studio Updates from the “toast” pop-up notification or from the Extensions and Updates dialog. This continues to be the simplest option. The installer downloads only the components you need (based on your current VS installed configuration), and then installs the bits as they’re received. This approach often provides a very good experience, but it does require being connected to the internet for the duration of the install. Because a connection isn’t always available, the installer also supports a /layout flag, which downloads all of the bits proactively to enable subsequent offline installation.


Getting involved now 

 

We also plan to ship ISO images for the RTM version of future Visual Studio updates, in addition to the existing distribution mechanism we already provide. We hope you will enjoy this additional option for downloading Visual Studio Updates.

16 Answers, 1 is accepted

Sort by
0
Marin Bratanov
Telerik team
answered on 18 May 2013, 08:51 AM
Hello,

I am adding here my response to your other thread with the same question in case you have not had a change to examine it yet:

In Q1 2013 we have made a lot of improvements on the paste from Word functionality in RadEditor (you can read more about that here) and I strongly advise that you upgrade to the latest version to benefit from them (it is currently Q1 2013 SP2 with Q2 2013 coming in about a month). You can test the content you paste from Word (which is by far not HTML) in our online demos and see if you get the expected behavior.

You can also toggle the hidden symbols in Word to confirm if the additional spaces are coming from the original content. I am attaching a screenshot that shows this button. When pasting content from Word it is often the case that there are additional spaces, new lines and other special symbols that you do not see in Word, but they are present as content and are, therefore, reflected in RadEditor.

This KB article can also be helpful when trying to reduce new paragraphs coming from MS Word.



Kind regards,
Marin Bratanov
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
Jani
Top achievements
Rank 1
answered on 15 Feb 2018, 08:09 PM

Hi Team,

When I am copying below text from MS word to Rad Editor. I am seeing lot of spaces and new lines.

Could you please help me how to avoid unnecessary spaces and new lines.

FYI, below is the text I am copying from MS word and pasting to RadEditor.

Regards,

Jani

0
Rumen
Telerik team
answered on 16 Feb 2018, 07:37 AM
Hello Jani,

Do you experience the reported problem in the following demo: Cleaning MS Word Formatting?

If everything is fine, consider upgrading to the latest version 2018.1.117. 

If you still experience the issue, open a support ticket and provide the Word file with the problematic content and screenshot/video demonstrating the problem.

Best regards,
Rumen
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Jani
Top achievements
Rank 1
answered on 16 Feb 2018, 10:09 AM

Hi Rumen,

Thanks for quick support. if you see my attachment in my previous post, you will get an idea, what text I am trying to copy from MSword to Rad Editor.

I am attached the ms word copy data. please check and tell me this type of (formating) data support by Rad Editor or not?

Note# If I use below script  code then what am coping data in MS word same way is not displaying in Rad Editor.

           If I remove the script code then it's working as per expected but unnecessary am seeing line breaks and spaces.

EX:   <telerik:RadEditor RenderMode="Lightweight"  Width="100%"  BorderStyle="None"
                                                                                                            runat="server" Content='<%# Bind("Comments") %>' Height="100px" Font-Names="Tahoma"
                                                                                                            ID="txtBox_PrescriberExplantionEdit" EditModes="Design" StripFormattingOptions="NoneSupressCleanMessage" StripFormattingOnPaste="MSWord">
                                                                                                            <Tools>
                                                                                                                <telerik:EditorToolGroup>
                                                                                                                </telerik:EditorToolGroup>
                                                                                                            </Tools>
                                                                                                        </telerik:RadEditor>
                                                                                                         <script type="text/javascript">
                                                                                                             Telerik.Web.UI.Editor.RemoveExtraBrakes.prototype.getHtmlContent = function (content) {
                                                                                                                 return content;
                                                                                                             }
                                                                                                             Telerik.Web.UI.Editor.StripJunkFilter.prototype.getHtmlContent = function (content) {
                                                                                                                 return content;
                                                                                                             }
</script>

0
Rumen
Telerik team
answered on 26 Feb 2018, 09:11 AM
Hi Jani,

The StripFormattingOnPaste is obsolete and you should use only the StripFormattingOptions property to instruct the editor what to do with the paste content.

To keep the list formatting set the StripFormattingOptions property to StripFormattingOptions="MSWord,ConvertWordLists", i.e.

<telerik:RadEditor RenderMode="Lightweight" Width="100%" BorderStyle="None"
    runat="server" Content='<%# Bind("Comments") %>' Height="100px" Font-Names="Tahoma"
    ID="txtBox_PrescriberExplantionEdit" EditModes="Design" StripFormattingOptions="MSWord,ConvertWordLists">
    <Tools>
        <telerik:EditorToolGroup>
        </telerik:EditorToolGroup>
    </Tools>
</telerik:RadEditor>
<script type="text/javascript">
    Telerik.Web.UI.Editor.RemoveExtraBrakes.prototype.getHtmlContent = function (content) {
        return content;
    }
    Telerik.Web.UI.Editor.StripJunkFilter.prototype.getHtmlContent = function (content) {
        return content;
    }
</script>



Regards,
Rumen
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Jani
Top achievements
Rank 1
answered on 26 Feb 2018, 09:47 PM

Hi Rumen,

Thanks. After adding above mentioned property it's working for me. Now, as per my requirement, Edit mode I am using "Rad Editor" and displaying purpose I am using Label. What ever data I enter into RadEditor and click on "Save" data displaying on label with additional line breaks or spaces.

Ex: I am enter data below format, for your reference sample with screenshot I am attaching. Please need helpful.

 

Thanks for your support.

Regards,

Jani

0
Rumen
Telerik team
answered on 27 Feb 2018, 12:08 PM
Hello,

Try to remove these lines below the editor declaration and test again:

Telerik.Web.UI.Editor.RemoveExtraBrakes.prototype.getHtmlContent = function (content) {
        return content;
    }
    Telerik.Web.UI.Editor.StripJunkFilter.prototype.getHtmlContent = function (content) {
        return content;
    }


If this does not work add a debugger and expect what is submitted by the Content server property of RadEditor. There should be some line feeds /r/n/ that you probably have to strip.

Best regards,
Rumen
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Jani
Top achievements
Rank 1
answered on 09 Mar 2018, 12:31 PM

Hi Team,

Could you please help me on below  issue.

I have using "RadEditor" and added tools file for tools bar, when I have ran the application, I am seeing un-necessary space or button. please tell me how I will resolve this issue.

Below is the code I am using.

.ASPX page code:

<telerik:RadEditor ID="RadEditor1" BorderStyle="None" runat="server" Width="50%" ToolsFile="ToolsFile.xml" 
                        Height="500px" Font-Names="Tahoma" Font-Size="11px" Style="margin-bottom: 5px;"
                        StripFormattingOptions="MSWordRemoveAll,ConvertWordLists" EnableResize="False"  
                        NewLineBr="False" StripFormattingOnPaste="NoneSupressCleanMessage" >
                        <Tools>
                            <telerik:EditorToolGroup>
                            </telerik:EditorToolGroup>
                        </Tools>
                    </telerik:RadEditor>

Tools.xml file

<?xml version="1.0" encoding="utf-8" ?>
<root>
  <modules>

  </modules>
  <tools>
    <tool name="PasteStrip" size="large"/>
    <tool name="Cut" size="medium"/>
    <tool name="Copy" size="medium" shortcut="CTRL+C"/>
    <tool name="Print" size="medium" shortcut="CTRL+P"/>
  </tools>
  <tools>
    <tool name="FontName" shortcut="CTRL+SHIFT+F"/>
    <tool name="RealFontSize" shortcut="CTRL+SHIFT+P" width="80px"/>
    <tool name="ConvertToLower" strip="FontDropDowns" />
    <tool name="ConvertToUpper" strip="FontDropDowns" />
    <tool name="Bold" strip="FontBasicTools" shortcut="CTRL+B"/>
    <tool name="Italic" strip="FontBasicTools" shortcut="CTRL+I"/>
    <tool name="Underline" strip="FontBasicTools" shortcut="CTRL+U"/>
    <tool name="StrikeThrough" strip="FontBasicTools1"/>
    <tool name="Superscript" strip="FontBasicTools1"/>
    <tool name="Subscript" strip="FontBasicTools1"/>
    <tool name="FormatStripper" strip="FontDropDowns" />
    <tool name="ForeColor"/>
    <tool name="BackColor"/>
  </tools>
  <tools>
    <tool name="InsertUnorderedList" strip="ListsAndIndention"/>
    <tool name="InsertOrderedList" strip="ListsAndIndention"/>
    <tool name="Indent" strip="ListsAndIndention"/>
    <tool name="Outdent" strip="ListsAndIndention"/>
    <tool name="InsertParagraph" strip="ListsAndIndention"/>
    <tool name="JustifyLeft" strip="Align"/>
    <tool name="JustifyCenter" strip="Align"/>
    <tool name="JustifyRight" strip="Align"/>
    <tool name="JustifyFull" strip="Align"/>
    <tool name="JustifyNone" strip="Align"/>
  </tools>
  <tools>
    <tool name="ApplyClass" />
    <tool name="FormatBlock" />
  </tools>
 </root>

0
Rumen
Telerik team
answered on 09 Mar 2018, 12:45 PM
Hi the,

Remove the following lines from the RadEditor declaration and test again:

 <Tools>
         <telerik:EditorToolGroup>
         </telerik:EditorToolGroup>
</Tools>

Regards,
Rumen
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Jani
Top achievements
Rank 1
answered on 10 Mar 2018, 12:45 AM

Hi Rumen,

Thanks for quick reply.  As you suggested above, It's working fine for radeditor edit mode ="Design". But I have one more rad editor and have property as editmode="Preview" (same page) as my requirement radeditor will look like as "LABEL" means no toolbar or menu bar will not be contain. so in this case I have removed the property Tools="Tools.xml" file and mentiond <Tools>
                                                                                                                <telerik:EditorToolGroup>
                                                                                                                </telerik:EditorToolGroup>
                                                                                                            </Tools>

Again,I am able to see additional tab (radeditor -->editmode="Preview"), if I have removed above lines then toolbar will be able to see and I am fail to reach requirement. please help me. (Same page I am using 2 rad editor's one radeditor using Editmode="Design" and other radeditor mentioed Editmode="Preview"here second radeditor will look like label)

Sample code for first radeditor :

<telerik:RadEditor ID="txtBox_PrescriberExplantionEdit" BorderStyle="None" runat="server"
   Width="100%" ToolsFile="ToolsFile.xml"   Height="150px" Font-Names="Tahoma" Font-Size="11px" Style="margin-bottom: 5px;"
    StripFormattingOptions="MSWordRemoveAll,ConvertWordLists" EnableResize="False"
   EditModes="Design" ContentAreaMode="Div" NewLineBr="False" StripFormattingOnPaste="NoneSupressCleanMessage"
  OnClientLoad="RadEditorOnLoad">
  </telerik:RadEditor>

Second Radeditor:

<telerik:RadEditor ID="lbl_PrescriberDescription" BorderStyle="None" runat="server"
 Width="100%"  Height="150px" Font-Names="Tahoma" Font-Size="11px"  Style="margin-bottom: 5px;"  StripFormattingOptions="MSWordRemoveAll,ConvertWordLists"  EnableResize="False" EditModes="Preview" ContentAreaMode="Div" NewLineBr="False" StripFormattingOnPaste="NoneSupressCleanMessage" OnClientLoad="RadEditorOnLoad">

<Tools>
 <telerik:EditorToolGroup />
 </Tools>
</telerik:RadEditor>

Note# Second radeditor looks like label and background color gery and first radeditor looks like textbox contain with menu/toolbar.

Regards,

Jani

0
Jani
Top achievements
Rank 1
answered on 12 Mar 2018, 08:09 PM

Hi Team,

This is urgent, any one can help or suggest me the solution on above post.

FYI,

I am using 2 radeditor's on same page, one radeditor for Edit mode (user enter text)here, I am displaying menu bar/toolbar along with radeditor1.

In radeditor2, I need to display radeditor like "Label",so set  radeditor edit mode property as "preview" and as per my requirement no menu bar/tool bar display for that I am not using ToolsFile ="tools.xml" property see below sample code.

<telerik:RadEditor ID="RadEditor2" BorderStyle="None" runat="server" Width="50%"
                        StripFormattingOptions="MSWordRemoveAll,ConvertWordLists" EnableResize="False"  
                        NewLineBr="False" StripFormattingOnPaste="NoneSupressCleanMessage" >
                        <Tools>
                            <telerik:EditorToolGroup>
                            </telerik:EditorToolGroup>
                        </Tools>
                    </telerik:RadEditor>
if I will keep like that above radeditor display with small tab button . if I will comment Tools in above sample code then I am getting Toolbar / menu bar with disable mode this case is wrong for me. 

*to remove toolbar /menu bar I have  uses below code , once write then the 2 radeditor menubar/ toolbar are not visible. this is wrong because 1radeditor(editmode="Design" ) menu bar will be able to see and 2radeditor(editmode="Preview") no menubar will display.

    .reToolCell, .reLeftVerticalSide, .reRightVerticalSide
        {
            display: none !important;
        }

Please help me asap.

Regards,

Jani

 

0
Jani
Top achievements
Rank 1
answered on 12 Mar 2018, 08:10 PM
Hi Team,
This is urgent, any one can help or suggest me the solution on above post.
FYI,
I am using 2 radeditor's on same page, one radeditor for Edit mode (user enter text)here, I am displaying menu bar/toolbar along with radeditor1.
In radeditor2, I need to display radeditor like "Label",so set  radeditor edit mode property as "preview" and as per my requirement no menu bar/tool bar display for that I am not using ToolsFile ="tools.xml" property see below sample code.
<telerik:RadEditor ID="RadEditor2" BorderStyle="None" runat="server" Width="50%"
                        StripFormattingOptions="MSWordRemoveAll,ConvertWordLists" EnableResize="False"  
                        NewLineBr="False" StripFormattingOnPaste="NoneSupressCleanMessage" >
                        <Tools>
                            <telerik:EditorToolGroup>
                            </telerik:EditorToolGroup>
                        </Tools>
                    </telerik:RadEditor>
if I will keep like that above radeditor display with small tab button . if I will comment Tools in above sample code then I am getting Toolbar / menu bar with disable mode this case is wrong for me. 
*to remove toolbar /menu bar I have  uses below code , once write then the 2 radeditor menubar/ toolbar are not visible. this is wrong because 1radeditor(editmode="Design" ) menu bar will be able to see and 2radeditor(editmode="Preview") no menubar will display.
    .reToolCell, .reLeftVerticalSide, .reRightVerticalSide
        {
            display: none !important;
        }
Please help me asap.
Regards,
Jani
0
Jani
Top achievements
Rank 1
answered on 12 Mar 2018, 08:10 PM
Hi Team,
This is urgent, any one can help or suggest me the solution on above post.
FYI,
I am using 2 radeditor's on same page, one radeditor for Edit mode (user enter text)here, I am displaying menu bar/toolbar along with radeditor1.
In radeditor2, I need to display radeditor like "Label",so set  radeditor edit mode property as "preview" and as per my requirement no menu bar/tool bar display for that I am not using ToolsFile ="tools.xml" property see below sample code.
<telerik:RadEditor ID="RadEditor2" BorderStyle="None" runat="server" Width="50%"
                        StripFormattingOptions="MSWordRemoveAll,ConvertWordLists" EnableResize="False"  
                        NewLineBr="False" StripFormattingOnPaste="NoneSupressCleanMessage" >
                        <Tools>
                            <telerik:EditorToolGroup>
                            </telerik:EditorToolGroup>
                        </Tools>
                    </telerik:RadEditor>
if I will keep like that above radeditor display with small tab button . if I will comment Tools in above sample code then I am getting Toolbar / menu bar with disable mode this case is wrong for me. 
*to remove toolbar /menu bar I have  uses below code , once write then the 2 radeditor menubar/ toolbar are not visible. this is wrong because 1radeditor(editmode="Design" ) menu bar will be able to see and 2radeditor(editmode="Preview") no menubar will display.
    .reToolCell, .reLeftVerticalSide, .reRightVerticalSide
        {
            display: none !important;
        }
Please help me asap.
Regards,
Jani
0
Jani
Top achievements
Rank 1
answered on 12 Mar 2018, 08:10 PM
Hi Team,
This is urgent, any one can help or suggest me the solution on above post.
FYI,
I am using 2 radeditor's on same page, one radeditor for Edit mode (user enter text)here, I am displaying menu bar/toolbar along with radeditor1.
In radeditor2, I need to display radeditor like "Label",so set  radeditor edit mode property as "preview" and as per my requirement no menu bar/tool bar display for that I am not using ToolsFile ="tools.xml" property see below sample code.
<telerik:RadEditor ID="RadEditor2" BorderStyle="None" runat="server" Width="50%"
                        StripFormattingOptions="MSWordRemoveAll,ConvertWordLists" EnableResize="False"  
                        NewLineBr="False" StripFormattingOnPaste="NoneSupressCleanMessage" >
                        <Tools>
                            <telerik:EditorToolGroup>
                            </telerik:EditorToolGroup>
                        </Tools>
                    </telerik:RadEditor>
if I will keep like that above radeditor display with small tab button . if I will comment Tools in above sample code then I am getting Toolbar / menu bar with disable mode this case is wrong for me. 
*to remove toolbar /menu bar I have  uses below code , once write then the 2 radeditor menubar/ toolbar are not visible. this is wrong because 1radeditor(editmode="Design" ) menu bar will be able to see and 2radeditor(editmode="Preview") no menubar will display.
    .reToolCell, .reLeftVerticalSide, .reRightVerticalSide
        {
            display: none !important;
        }
Please help me asap.
Regards,
Jani
0
Jani
Top achievements
Rank 1
answered on 13 Mar 2018, 11:59 AM

Hi Team,

Any one help me on my previous post.

Thanks for your support.

0
Kathryn
Telerik team
answered on 14 Mar 2018, 06:38 PM
Hello,

It seems that you do not have any active licenses in your account. Because of this, we can no longer provide any support for your issues. If you would like to receive support, you will need to purchase a license. If you would like, I am happy to connect you with a product specialist for a discussion on purchasing. 

If you are using a licensed version of the product, please re-submit this ticket under the correct account so that you are eligible for support. If you have any questions about this, please let me know. Thank you!


Regards,
Kathryn
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Editor
Asked by
Pbu
Top achievements
Rank 1
Answers by
Marin Bratanov
Telerik team
Jani
Top achievements
Rank 1
Rumen
Telerik team
Kathryn
Telerik team
Share this question
or