Restrict to table editing only

2 posts, 0 answers
  1. Robert
    Robert avatar
    20 posts
    Member since:
    Sep 2010

    Posted 05 Sep 2011 Link to this post

    Hi all,

    Is there a way to restrict the Editor to only allow the user to edit a single table?

    I've configured it so only the table toolbar displays, but I want to stop the user from adding extraneous content outside of the table element.

    Possible?

    Also, how do I specify a TH as opposed to a TD?

    Thanks,

    Rob
  2. Rumen
    Admin
    Rumen avatar
    14031 posts

    Posted 07 Sep 2011 Link to this post

    Hi Robert,

    The implementation of the desired feature will be not easy, because the user could paste or drag content from outside of the iframe based content area. If the HTML mode is enabled, he / she will be able to enter content in it as well.

    What you can do is to implement your own custom content filter that will strip all tags different from table, tr, td, thead and th.

    Here is an example which demonstrates how to strip all HTML tags EXCEPT those expliclitly listed in the regular expression used in the custom content filter below:

    Copy Code
    Copy Code
    Copy Code
    <script type="text/javascript">
    function OnClientLoad(editor, args) {
    editor.get_filtersManager().add(new AllowedTagsFilter());
    }
    AllowedTagsFilter = function() {
    AllowedTagsFilter.initializeBase(this);
    this.set_isDom(false);
    this.set_enabled(true);
    this.set_name("AllowedTagsFilter");
    this.set_description("Strip the unwanted tags from RadEditor");
    }
    AllowedTagsFilter.prototype =
    {
    getHtmlContent: function(content) {
    return this._removeHtmlTags(content);
    },
    getDesignContent: function(content) {
    return this._removeHtmlTags(content);
    },
    _removeHtmlTags: function(initContent) {
    var cleanContent;
    //Perform necessary REGEX replacement to remove unsupported HTML tags
    //Supported Reporting HTML tags: FONT, STRONG, B, EM, I, U, A, OL, UL, LI, DIV, SPAN, P, BR, CENTER
    //HTML must be XHTML valid, too, but Editor already provides that filter
    //Following REGEX will remove all HTML tags EXCEPT those expliclitly listed
    cleanContent = initContent.replace(new RegExp("<(?!\/?(font|strong|b|em|(i(?!mg))|u|a|ol|ul|li|div|span|p|br|center)(?=>|\s?.*>))\/?.*?>", "ig"), "");
    return cleanContent;
    }
    }
    AllowedTagsFilter.registerClass('AllowedTagsFilter', Telerik.Web.UI.Editor.Filter);
    </script>
    <telerik:RadEditor runat="server" OnClientLoad="OnClientLoad" ID="RadEditor1">
    <Content>sample content test <br/> test</Content>
    </telerik:RadEditor>

    You can find another custom content filter in the following code library:

    http://www.telerik.com/community/code-library/aspnet-ajax/editor/html-tag-stripping-filter.aspx

    You can also set the StripFormattingOptions property to "All" or "AllExceptNewLines" so that the formatting of the pasted content is stripped.


    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 >>

Back to Top