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

Feature request; clean up Word/Font stuff

10 Answers 57 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Derek
Top achievements
Rank 1
Derek asked on 03 Aug 2010, 09:56 PM
We often have users pasting content from Word or other editors, and often the text contains extraneous codes, extra font tages, span tags wrapped around every block of text, etc. The users often don't even know the extra tags are there (they don't typically use HTML view, and wouldn't understand most of what they would see there anyway). It only becomes noticeable when they ask why the results look 'funny' when viewed. I don't believe this is an uncommon request; I know that we run into it regularly, and had incorporated a solution with a prior HTML editing control that worked well.

What would be nice is to have a couple of button options on the Editor, as follows;

Clean up Font Tags
This would remove any font tags in the content, and remove any nested or redundant markup.

Clean up Word Content
This would remove all extra content added by MS Word, and restore the pasted content to generic HTML.

I know we could sit down and code these, but it would be nice to have them built right in the control.

10 Answers, 1 is accepted

Sort by
0
Accepted
Rumen
Telerik team
answered on 04 Aug 2010, 12:45 PM
Hello Derek,

The requested features are already supported by RadEditor. Please, see the following help article Cleaning Word Formatting and test the same named demo: Cleaning Word Formatting.

All the best,
Rumen
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Chris Trina
Top achievements
Rank 1
answered on 30 Aug 2010, 11:19 PM
Rumen,

What settings do we need to truely strip all of the word formatting, like your demo does if you choose the manual strip option in the second window?  I want this to happen on a paste but none of the setting go this far.  Here is the word i am testing with.

Hello world this is a test

  • One
  • Two
  • Three
  • Four
  • Five
  • Six

 

prior to the paste options 3 - 4 were in the table

Chris

0
Rumen
Telerik team
answered on 31 Aug 2010, 10:00 AM
Hi Chris,

Did you try to set StripFormattingOptions to MSWordRemoveAll? This setting should work as expected and you can set and test it in this demo: Cleaning Word Formatting.

Since the StripFormattingOptions is enum, you can set multiple values at the same time, e.g.

StripFormattingOptions="MSWordRemoveAll,Font,Span,CSS"

This could be helpful to strip different type of formatting from the pasted content.


Best regards,
Rumen
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Chris Trina
Top achievements
Rank 1
answered on 31 Aug 2010, 12:51 PM
Rumen,

Thanks for the response.  Two items exist, the stripping is different between using the Ctrl+V keys and using the paste icon, also bullets are not being stripped.  Ideally I would like to strip everything except line returns and definitely want the stripping to be consistent regardless of how you paste.  I've attached an image which shows the differences and the control definition.

Thanks

Chris
0
Chris Trina
Top achievements
Rank 1
answered on 31 Aug 2010, 01:07 PM
Rumen,

I got around the pasting inconsistency by adding the shortcut parameter to my tools file, the icon and ctrl+v now work the same.
 

<

 

 

tool name="PastePlainText" shortcut="CTRL+V" />

 


Is there anyway to strip the bullets?

Thanks

Chris
0
Rumen
Telerik team
answered on 31 Aug 2010, 02:13 PM
Hi Chris,

I was unable to reproduce the reported inconsistency problem. You can see my test at http://screencast.com/t/OTdlZmU4MW. Am I missing something? For your convenience I have attached my test project.

As to the second request: you can use the OnClientPasteHtml event to modify the pasted content. Here is a basic demo:

    <Telerik:RadEditor ID="RadEditor1" OnClientPasteHtml="OnClientPasteHtml" StripFormattingOptions="AllExceptNewLines" runat="server"></Telerik:RadEditor>
     <script type="text/javascript">
         function OnClientPasteHtml(sender, args) {
             var commandName = args.get_commandName();
             var value = args.get_value();

             if (commandName == "PastePlainText") {
                 value = value.replace(/\*/gi, "");
                 args.set_value(value);  //set the modified pasted content in the editor
             }
         }
</script>


Best wishes,
Rumen
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Christian Bruckhoff
Top achievements
Rank 1
answered on 12 Aug 2011, 07:11 PM
Telerik,

We are using version 2011.1.519 of the editor and notice that the toolbar has a stripper with multiple options to strip things like the css font elements.

This is working fine.  It even gets the font information in the spans and divs.  Is this handled by regex?  We are trying to strip the same kind of elements for Ntext fields that were generated by the editor for a PDF report where we want to have font consistency.

Could you give me a clue how this was accomplished (again, regex) on the client-side?

Thank you
0
Dobromir
Telerik team
answered on 17 Aug 2011, 06:53 PM
Hi Toby,

Yes, stripping the formatting is achieved by parsing the content of the editor client-side (JavaScript) and remove unwanted elements using regular expressions. For example the following code is used to strip the style's attribute from the elements:
textHtml = textHtml.replace(/(<[^>]+) style="[^"]*"([^>]*>)/ig, "$1 $2");

On a side note, I am not quite sure I understand exactly what you are trying to achieve. Could you please describe in more details the exact scenario, so we can try to provide a guidance on how you can possibly achieve the required result?

All the best,
Dobromir
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

0
Christian Bruckhoff
Top achievements
Rank 1
answered on 25 Aug 2011, 03:13 PM
Dobromir, sorry for the delay.  Your email ended up in my spam folder.

We are trying to find a way to strip just the font information (size, font family, etc.) from html generated by the Telerik editor.  Users may have input data using the editor with varying font information.  For reporting purposes we need to take this data and have it use a uniform font, size, etc.  (without affecting the original html that is stored)

Right now in our reports we strip font tags and all span/div tags to achieve this purpose.  The only problem with this is that it is like taking a hammer to pound a pin.  It can strip style information from the span/div tags that we may want.  We only want the ability to strip the font information from the span/div tags and leave the other style information there.

Does this makes sense?

Thank you for your help
0
Rumen
Telerik team
answered on 30 Aug 2011, 11:56 AM
Hello Toby,

You can implement your own custom content filter (as the below one that we prepared for your convenience) that will strip the desired font related inline styles:

<telerik:radeditor runat="server" ID="RadEditor1" SkinID="DefaultSetOfTools" OnClientLoad="OnClientLoad">
    <Content>
        <strong><br /> Switch to Html mode to run the content filter.<br /> You will see that the casing is changed to upper case.</strong>
    </Content>
</telerik:radeditor>
<script type="text/javascript">
    function OnClientLoad(editor, args) {
        editor.get_filtersManager().add(new MyFilter());
    }
    MyFilter = function () {
        MyFilter.initializeBase(this);
        this.set_isDom(false);
        this.set_enabled(true);
        this.set_name("RadEditor filter");
        this.set_description("RadEditor filter description");
    }
    MyFilter.prototype =
{
    getHtmlContent: function (content) {
        content = content.replace(/(<[^>]*style=")([^"]*)("[^>]*>)/ig,
        function (match, g1, g2, g3) {
            g2 = g2.replace(/(?:(?:^color)|(?:[\s;]color)):[^;]*;/gi, "");
            g2 = g2.replace(/font-size[^;]*;/gi, "");
            g2 = g2.replace(/font-family[^;]*;/gi, "");
            return g1 + g2 + g3;
        });
        return content;
    }
}
    MyFilter.registerClass('MyFilter', Telerik.Web.UI.Editor.Filter);
</script>


Kind regards,
Rumen
the Telerik team

Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

Tags
Editor
Asked by
Derek
Top achievements
Rank 1
Answers by
Rumen
Telerik team
Chris Trina
Top achievements
Rank 1
Christian Bruckhoff
Top achievements
Rank 1
Dobromir
Telerik team
Share this question
or