Run Custom Content Filter on load

[Jakob Christensen]

Hi

I have implemented a Custom Content Filter that converts web control-like tags <tag:xslfile /> to an image and back.

I want to run this filter on load, so that the images are displayed in Design view, but the original tag is displayed in Html view.

The hacky way is to do this:

editor.set_mode(2);
editor.set_mode(1);

But this makes the editor flicker.

Is there a nicer way?

Thanks
--Jakob

[Rumen]

Hello Jakob,

Here is an example demonstrating how to execute a custom content filter when loading the editor on the page:

<telerik:radeditor  runat="server" ID="RadEditor1" 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());
        setTimeout(function() {
            var myFilter = editor.get_filtersManager().getFilterByName("MyFilter");
            editor.set_html(myFilter.getDesignContent(editor.get_html(true)));

        }, 0);
    }

    MyFilter = function() {
        MyFilter.initializeBase(this);
        this.set_isDom(false);
        this.set_enabled(true);
        this.set_name("MyFilter");
        this.set_description("RadEditor filter description");
    }
    MyFilter.prototype =
{
    getHtmlContent: function(content) {
        var newContent = content;
        //Make changes to the content and return it
        newContent = newContent.toUpperCase();
        return newContent;
    },

    getDesignContent: function(content) {
        var newContent = content;
        //Make changes to the content and return it
        newContent = newContent.toUpperCase();
        return newContent;
    }
}
MyFilter.registerClass('MyFilter', Telerik.Web.UI.Editor.Filter);
</script>

Sincerely,
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.

[Jakob Christensen]

Thanks - it works, I guess - but my filter is DOM based.

So I ended up doing this, which works nicely:

setTimeout(function() {
          var filterManager = editor.get_filtersManager();
          var myFilter = filterManager.getFilterByName("MyFilter");

          myFilter.getDesignContent(editor.get_contentArea());
        }, 0);