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

5 posts, 2 answers
  1. Márcio
    Márcio avatar
    49 posts
    Member since:
    Sep 2006

    Posted 18 Mar 2015 Link to this post

    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
  2.
  3. Answer
    Ianko
    Admin
    Ianko avatar
    1956 posts

    Posted 20 Mar 2015 Link to this post

    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
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  5. Márcio
    Márcio avatar
    49 posts
    Member since:
    Sep 2006

    Posted 20 Mar 2015 Link to this post

    It worked perfectly for the custom commandas. But I stil have problem with the heihgt of RadPanels.
  7. Answer
    Vessy
    Admin
    Vessy avatar
    2414 posts

    Posted 21 Mar 2015 Link to this post

    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
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  8.
  9. Márcio
    Márcio avatar
    49 posts
    Member since:
    Sep 2006

    Posted 23 Mar 2015 in reply to Vessy Link to this post

    Thanks a lot. It works.
Back to Top