Custom commands for RadEditor not work when using RadAjaxManager in same page.

[Márcio]

Hey guys I have a page with a RadListView and have in it an ItemTemplate with a RadEditor.
As soon as I started to use a RadAjaxManager to be able to have a RadAjaxLoadingPanel, the page rendering was incorrect, the height of the RadPanes was very small and the custom buttons I did for the RadEditor crashed and began to display the following message:

The command CustomCommand is not implemented yet.

However I have implemented the Custom Commands immediately below the RadEditor's statement as follows:

...
</telerik:RadEditor>
<script type="text/javascript">
 //<![CDATA[
 //inserir imagens que fazem parte da lista de anexos
 Telerik.Web.UI.Editor.CommandList["ImageManager"] = function (commandName, editor, args) { ... some code ... };
 ...
 ...
 other custom commands
 ...
 ...
</script>

And all my RadPanes I set the Height="100%"

This text was translated from Portuguese into English by the translator google

[Ianko]

Hello Márcio,

I have just answered you in the support ticket about the same matter (#918015). Please review the suggestion and let us continue the conversation there. Thank you. 

For everyone else interested in the matter: Using AJAX-enabled controls, should always be considered the correct ordering of controls' loading and scripts' loading. In this case, it is best to load the custom tools' logic after loading RadEditor. This can be easily done by using the OnClientLoad event.

Example:

<telerik:RadEditor ID="RadEditor1" runat="server" ToolsFile="~/Delete/ToolsFile.xml" OnClientLoad="OnClientLoad"></telerik:RadEditor>

<script type="text/javascript">
    function OnClientLoad() {
        Telerik.Web.UI.Editor.CommandList["Save"] = function (commandName, editor, args) {
            editor.pasteHtml("<label>Testing command save...</label><br />");
        };

        Telerik.Web.UI.Editor.CommandList["Cancel"] = function (commandName, editor, args) {
            editor.pasteHtml("<label>Testing command cancel...</label><br />");
        };
    }
</script>

 
Regards,
Ianko
Telerik

 

 

[Márcio]

It worked perfectly for the custom commandas. But I stil have problem with the heihgt of RadPanels.

[Vessy]

Hi Márcio,

I have just answer your support ticket on the subject, for convenience I am pasting my answer here as well:

When updating a control via RadAjaxManager it gets wrapped with an update panel. This panel height also has to be configured in case you have a Splitter (or another control) with height set in percentage. Configuring the RadAjaxManager's UpdatePanelHeight property should fix the issue:

<Telerik:RadAjaxManager ID="ajaxManager" runat="server">
    <AjaxSettings>
        <Telerik:AjaxSetting AjaxControlID="btnEditarControles">
            <UpdatedControls>
                <Telerik:AjaxUpdatedControl ControlID="mainSplitter" LoadingPanelID="RadAjaxLoadingPanel1" UpdatePanelHeight="100%"/>
            </UpdatedControls>
        </Telerik:AjaxSetting>
        <Telerik:AjaxSetting AjaxControlID="btnEditarConteudo">
            <UpdatedControls>
                <Telerik:AjaxUpdatedControl ControlID="mainSplitter" LoadingPanelID="RadAjaxLoadingPanel1" UpdatePanelHeight="100%"/>
            </UpdatedControls>
        </Telerik:AjaxSetting>
    </AjaxSettings>
</Telerik:RadAjaxManager>

I hope this helps.

Regards,
Vessy
Telerik

 

 

[Márcio]

Thanks a lot. It works.