Telerik is a leading vendor of ASP.NET AJAX, ASP.NET MVC, Silverlight, WinForms and WPF controls and components, as well as .NET Reporting, .NET ORM , .NET CMS, Code Analysis, Mocking, Team Productivity and Automated Testing Tools. Building on its expertise in interface development and Microsoft technologies, Telerik helps customers build applications with unparalleled richness, responsiveness and interactivity. Telerik products help thousands of companies to be more productive and deliver reliable applications under budget and on time.
Version Q2 2011 released 07/12/2011
select

Editor / Cleaning Word Formatting

Automatic format stripping
  1. Formatting is stripped on paste - using the StripFormattingOptions setting
  2. Strip formatting on page submit (useful for browsers that do not provide onpaste event)
   
 
 
  
   
The enumeration values of the StripFormattingOnPaste property are:
  • NoneSupressCleanMessage: Doesn't strip anything on paste and does not prompt user whether MS formatting should be cleaned
  • None: If no MS Word formatting is detected, content is pasted as is. If MS Word formatting exists, user is prompted to clean it.
  • MSWord: strips Word-specific tags , preserving fonts and text sizes.
  • MSWordNoFonts: strips Word-specific tags, preserving text sizes.
  • MSWordRemoveAll: strips Word-specific tags, fonts and text sizes.
  • Css: strips CSS styles .
  • Font: strips Font tags .
  • Span: strips Span tags .
  • AllExceptNewLines: Clears all tags except "br" and new lines (\n) .
  • All: strips all HTML formatting and pastes plain text.
Formatting can also be stripped automatically on page submit for browsers that do not provide onpaste event using the OnClientSubmit event and FormatStripper command of RadEditor, e.g.

<script type="text/javascript">
function OnClientSubmit(editor)
{
     editor.fire("FormatStripper", {value : "WORD"});
}
</script>
<telerik:RadEditor runat="server" OnClientSubmit="OnClientSubmit"/>
Manual format stripping
  1. Using one of the special Paste tools for pasting content
  2. Using the FormatStripper tool
   
 
 
  
   
Use the Paste from WordPaste From Word button, Paste from Word cleaning Fonts and SizesPaste From Word No Fonts No Sizes button or "Paste Plain Text" tools to strip and paste text copied from MS Word.
Use the Format StripperFormat Stripper tool icon to remove special formatting from existing text in the RadEditor.
Format Stripper Demo

  • Cleaning Word Formatting

    1. Strip Word-formatting on paste

    The "Paste from Word" button Paste From Word button allows you to strip the Word-specific tags from the text copied in the clipboard and will paste it in RadEditor with a single click.

    2. Strip Word-formatting on paste (cleaning fonts and sizes)

    The "Paste from Word cleaning fonts and sizes" button Paste From Word No Fonts No Sizes button will clean all Word-specific tags plus and will remove font names and text sizes, as they are rarely used in the web environment.

    3. Forced format stripping on Paste

    Developers can now enforce content formatting using the new StripFormattingOptions property. As a result, format stripping will be applied to all pasted content, with the following options: None, MSWord (retains fonts and sizes), MSWordNoFonts, MSWordRemoveAll, Css, Font, Span, All.

    4. Word Content in Clipboard Interception

    In case the user is trying to paste Word content with the regular Paste button or Ctrl+V, a dialog will prompt whether the Word markup should be cleaned. If the Clipboard content does not come from Word, the dialog will not be shown.

    5. Strip Word-formatting after paste

    As an alternative to the "Paste from Word" tool (item 1) you may paste the formatted content first and then strip it using the "Format Stripper" tool.

    6. Paste plain text

    The "Paste Plain Text" button Paste Plain Text button works similarly to "Paste from Word" Paste From Word button, but it removes all HTML formatting and pastes plain text, preserving the line breaks.

    7. Paste as HTML

    This new tool Paste As Html button allows you to paste the HTML content of the Clipboard as code, which may be quite convenient for developer-oriented applications (e.g. support systems, forums, etc.)

    More information on the different stripping options is available in the following help article: Cleaning Word Formatting.

Source Code

C# VB.NET
Show code in new window Demo isolation steps
  • <%@ Page Language="C#" AutoEventWireup="true" Theme="Default" CodeFile="DefaultCS.aspx.cs"
        Inherits="Telerik.Web.Examples.Editor.CleaningWordFormatting.DefaultCS" %>

    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>
    <%@ Register TagPrefix="qsf" TagName="Header" Src="~/Common/Header.ascx" %>
    <%@ Register TagPrefix="qsf" TagName="HeadTag" Src="~/Common/HeadTag.ascx" %>
    <%@ Register TagPrefix="qsf" TagName="Footer" Src="~/Common/Footer.ascx" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <qsf:HeadTag ID="Headtag1" runat="server" />
        <style type="text/css">
        td.module
        {
            background: #DFF3FF none repeat scroll 0 0;
            border: 1px solid #C6E1F2;
            color: #333;
            padding: 1.2em;
        }
        .ol
        {
            margin-left: 24px;
            
        }
        
        .ol table
        {
            display: block;
            margin: 8px 0;
        }
        </style>
    </head>
    <body class="BODY">
        <form id="form1" runat="server">
            <qsf:Header ID="Header1" runat="server" NavigationLanguage="c#" />
            <telerik:RadScriptManager ID="ScriptManager1" runat="server" />
            <table border="0" cellpadding="0" cellspacing="0" width="880" >
                <tr valign="top" >
                    <td class="module">
                        <asp:UpdatePanel ID="UP1" runat="server">
                            <ContentTemplate>
                                 
                                <telerik:RadToolTip ID="RadToolTip1"
                                   Title = "Cleaned editor content"
                                   Animation="Resize"
                                   ShowCallout="true"
                                   Position="Center"
                                   Height ="500px"
                                   Width="500px"
                                   
                                   RelativeTo="BrowserWindow"
                                   Modal="true"
                                   HideEvent="ManualClose"
                                runat="server" ></telerik:RadToolTip>
                                
                                    <strong>Automatic format stripping</strong>
                                    <ol class="ol">
                                        <li>Formatting is stripped on paste - using the <b>StripFormattingOptions</b> setting<br />
    <asp:RadioButtonList RepeatDirection="Horizontal" CellPadding="0" CellSpacing="0"
    OnSelectedIndexChanged="RadioButtonListStripFormattingOptions_SelectedIndexChanged"
    CssClass="text" ID="RadioButtonListEditMode" runat="server" AutoPostBack="True">
                                                <asp:ListItem Value="MSWord" Selected="True">MSWord</asp:ListItem>
                                                <asp:ListItem Value="MSWordRemoveAll">MSWordRemoveAll</asp:ListItem>
                                                <asp:ListItem Value="Css">Css</asp:ListItem>
                                                <asp:ListItem Value="Font">Font</asp:ListItem>
                                                <asp:ListItem Value="Span">Span</asp:ListItem>
                                                <asp:ListItem Value="All">All</asp:ListItem>
                                                 <asp:ListItem Value="None">None</asp:ListItem>
                                            </asp:RadioButtonList>
                                        </li>
                                        <li>Strip formatting on page submit (useful for browsers that do not provide onpaste
                                            event)
                                            <asp:Button ID="Button1" runat="server" UseSubmitBehavior="false" OnClick="Button1_Click" Text="Submit and Clean" style="display: block; margin: 8px 0 0 0;" />
                                        </li>
                                    </ol>
                                    <script type="text/javascript">
                                    function OnClientSubmit(editor)
                                    {
                                         //other possible values are All, ALL_NO_BRAKES, CSS, SPAN, FONT, WORD_ALL and WORD_NO_FONTS
                                         editor.fire("FormatStripper", {value : "WORD"});
                                    }
                                    </script>
                                    <telerik:RadEditor runat="server" OnClientSubmit="OnClientSubmit" ID="RadEditor1" SkinID="BasicSetOfTools"
                                        Width="420" Height="200" EnableResize="false">
                                        <Content>
                                            <p class="MsoNoSpacing" style="margin: 0in 0in 0pt;"><span class="MsoIntenseEmphasis" style="color: #4f81bd;"><strong><em><span style="font-family: calibri;"> <br />
                                            Experiment with the various options of the StripFormattingOptions setting for cleaning Word formatting.</span></em></strong></span></p>
                                            <p class="MsoNoSpacing" style="margin: 0in 0in 0pt;"><span class="MsoIntenseEmphasis"><strong><em><span style="color: #4f81bd; font-family: calibri;"> The content here has MS Word formatting which you can strip on submit by clicking on the "Submit and Clean" button above.<o:p></o:p></span></em></strong></span></p>
                                        </Content>
                                    </telerik:RadEditor>
                              
                         
                            </ContentTemplate>
                        </asp:UpdatePanel>
                        </td>
                    <td class="module" >
                     
                            The enumeration values of the <strong>StripFormattingOnPaste</strong> property are:<br />
                            <ul>
                            <li><span style="font-size: 9pt"><strong>NoneSupressCleanMessage:</strong> Doesn't strip
                                    anything on paste and does not prompt user whether MS formatting should be cleaned</span></li>
                                    
                                <li><span style="font-size: 9pt"><strong>None:</strong> If no MS Word formatting is detected, content is pasted as is. If MS Word formatting exists, user is prompted to clean it.</span></li>
                                
                                <li><span style="font-size: 9pt"><strong>MSWord:</strong> strips Word-specific tags
                                    , preserving fonts and text sizes.</span></li>
                                <li><span style="font-size: 9pt"><strong>MSWordNoFonts:</strong> strips Word-specific
                                    tags, preserving text sizes.</span></li>
                                <li><span style="font-size: 9pt"><strong>MSWordRemoveAll:</strong> strips Word-specific
                                    tags, fonts and text sizes.</span></li>
                                <li><span style="font-size: 9pt"><strong>Css:</strong> strips CSS styles .</span></li>
                                <li><span style="font-size: 9pt"><strong>Font:</strong> strips Font tags .</span></li>
                                <li><span style="font-size: 9pt"><strong>Span:</strong> strips Span tags .</span></li>
                                 <li><span style="font-size: 9pt"><strong>AllExceptNewLines</strong>: Clears all tags
                                    except "br" and new lines (\n) </span>.</li>
                                <li><span style="font-size: 9pt"><strong>All</strong>: strips all HTML formatting and
                                    pastes plain text.</span></li>
                               
                            </ul>
                                
                               Formatting can also be stripped automatically on page submit for browsers that do not provide
                                <strong>onpaste</strong> event using the OnClientSubmit event and
                                FormatStripper command of RadEditor, e.g.<br />
                                <br />
                                <span style="color: #0000ff">&lt;</span><font color="maroon">script</font><font color="red">
                                    type</font><font color="blue">="text/javascript"&gt;</font><font color="black"><br />
                                    </font><font color="blue">function </font><font color="black">OnClientSubmit(editor)<br />
                                        {<br />
                                    </font><font color="blue">&nbsp; &nbsp; &nbsp;</font><font color="black">editor.fire(</font><font
                                        color="#808080">"FormatStripper"</font><font color="black">, {</font><font color="blue">value
                                        </font><font color="black">: </font><font color="#808080">"WORD"</font><font color="black">})</font><font
                                            color="blue">; </font><font color="black"><br />}<br />
                                            </font><font color="blue">&lt;/</font><font color="maroon">script</font><font color="blue">&gt;</font><font
                                                color="black"><br />
                                            </font><font color="blue">&lt;</font><font color="maroon">telerik:RadEditor</font><font
                                                color="red"> runat</font><font color="blue">="server"</font><font color="red"> OnClientSubmit</font><font
                                                    color="blue">="OnClientSubmit"</font><font
                                                        color="blue">/&gt;</font>
                            
                      
                    </td>
                </tr>
                <tr valign="top">
                    <td class="module">
                        
                            <b>Manual format stripping</b>
                            <ol>
                                <li>Using one of the special Paste tools for pasting content</li>
                                <li>Using the FormatStripper tool</li>
                            </ol>
                             <telerik:RadEditor runat="server" ID="RadEditor2" Width="420" Height="200" EnableResize="false">
                                <Tools>
                                    <telerik:EditorToolGroup>
                                        <telerik:EditorTool Name="Paste" />
                                        <telerik:EditorTool Name="PasteFromWord" />
                                        <telerik:EditorTool Name="PasteFromWordNoFontsNoSizes" />
                                        <telerik:EditorTool Name="PastePlainText" />
                                        <telerik:EditorTool Name="PasteAsHtml" />
                                    </telerik:EditorToolGroup>
                                    <telerik:EditorToolGroup>
                                        <telerik:EditorTool Name="FormatStripper" />
                                    </telerik:EditorToolGroup>
                                </Tools>
                                <Content>
                                   <br /><strong><em><span style="color: #4f81bd; font-family: calibri;">Use the Paste from Word, Paste from Word cleaning Fonts and Sizes , or Paste Plain Text tools to strip and paste text copied from MS Word.</span> <br />
                                   <br /><span style="color: #4f81bd; font-family: calibri;">Use the FormatStripper to remove Word-formatting from existing text in the RadEditor.</span></em> </strong>
                                </Content>
                            </telerik:RadEditor>
                    
                        
                       
                    </td>
                    <td class="module" >
                    
                            Use the <strong>Paste from Word</strong><img src="Icons/PasteFromWord.gif"
                                alt="Paste From Word button" />, <strong>Paste from Word cleaning Fonts and Sizes</strong><img
                                    src="Icons/PasteFromWordNoFontsNoSizes.gif"
                                    alt="Paste From Word No Fonts No Sizes button" /> or "<strong>Paste Plain Text</strong>" tools to strip and paste text copied from MS Word.
                            <br />
                            Use the <strong>Format Stripper</strong><img src="Icons/FormatStripper.gif"
                                alt="Format Stripper tool icon" />
                            to remove special formatting from existing text in the RadEditor.<br />
                            <img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px;
                                border-right-width: 0px" src="Icons/FormatStripper.png" alt="Format Stripper Demo" />
                       
                    </td>
                </tr>
            </table>
            
            <qsf:Footer runat="server" ID="Footer1" />
        </form>
    </body>
    </html>

Get more than expected!

 
 

Take your time to truly experience the power of RadControls for ASP.NET AJAX with a free 60-day trial backed up by Telerik’s unlimited dedicated support.

Download your RadControls for ASP.NET AJAX trial and jumpstart your development with the available Getting Started resources.

If you have any questions, do not hesitate to contact us at sales@telerik.com.

Copyright 2002-2024 © Telerik. All right reserved
Telerik Inc, 201 Jones Rd, Waltham, MA 02451