Complex editor issue

6 posts, 0 answers
  1. Ross Presser
    Ross Presser avatar
    30 posts
    Member since:
    Dec 2008

    Posted 22 Dec 2008 Link to this post

    I've inherited a complex project that we've just upgraded to 2008 Q2. And I've got a stubborn problem. And I'm very new to Telerik altogether so I'm fumbling a lot.

    My page setup.aspx has a RadAjaxLoadingPanel. It loads many things under various circumstances; under one special circumstance it loads a custom control tabbed.ascx.  Tabbed.ascx contains a RadTabStrip that shows various RadPageViews. One of those RadPageViews displays two RadEditors, but only some of the time (based on which radio button is selected).

    Each of the RadEditors adds a slightly different custom dropdown, which is filled server-side. The purpose of these pulldowns is to enable inserting various kinds of text into the editor box. Previously this was enabled with these client-side javascript blocks:

    <script type="text/javascript">
                        if (typeof(RadEditorCommandList) != "undefined")
                            {
                                RadEditorCommandList["Fields"] = function(commandName, editor, oTool)
                                {
                                oValue = oTool.GetSelectedValue();
                                editor.PasteHtml (oValue);
                                };
                            };
    </script>

    Now, the help file instructs me to use this sort of construction instead:

    <telerik:RadEditor ... OnClientCommandExecuting="OnClientCommandExecuting" />
    <script type="text/javascript">
                function OnClientCommandExecuting(editor, args)
                {
                   var name = args.get_name();
                   var val = args.get_value();
                   if (name == "Fields")
                   {
                       editor.pasteHtml(val);       
                       //Cancel the further execution of the command as such a command does not exist in the editor command list
                       args.set_cancel(true);
                   }
                }
    </script>

    This absolutely would not work, no matter where I put it in tabbed.ascx.  It finally worked when I put it at the top of setup.aspx, which is annoying because setup.aspx really doesn't know anything about the editors and the script should stay close to what uses it. But anywhere in tabbed.ascx, Firefox's error console would report that OnClientCommandExecuting() wasn't defined. So I moved it to setup.aspx, and it seems to be working now.

    However, there's still a problem.  In IE, it just works. But in Firefox 3.0, it only works for a while. The first time you cause the page to display those editors, it works. But if you do anything that hides and then recreates the editors, they are frozen solid. You cannot type in them, and neither the custom pulldowns nor any other toolbar control does anything.  If you leave the page completely and come back, you get another chance.

    Like I said, in IE7, it just works, any number of times. In Firefox 3.0 it dies after the first time.

    Any suggestions?
  2. Ross Presser
    Ross Presser avatar
    30 posts
    Member since:
    Dec 2008

    Posted 22 Dec 2008 Link to this post

    I guess I will start trying to recreate this in a smaller project ...
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Nikolay Raykov
    Admin
    Nikolay Raykov avatar
    102 posts

    Posted 29 Dec 2008 Link to this post

    Hi Ross,

    Put your JavaScript code in RadScriptBlock which will handle your complex scenario. Here is the declaration:

    <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">  
        <script type="text/javascript">  
        function OnClientCommandExecuting(editor, args)  
        {  
           var name = args.get_name();  
           var val = args.get_value();  
           if (name == "Fields")  
           {  
               editor.pasteHtml(val);         
               //Cancel the further execution of the command as such a command does not exist in the editor command list  
               args.set_cancel(true);  
           }  
        }  
    </script> 
    </telerik:RadScriptBlock> 

    Now your event handler function will be available and your users will not receive error message.

    Here you could read more about this control and its usage:

    http://www.telerik.com/help/aspnet-ajax/ajxradscriptblockradcodeblock.html

    Best wishes,
    Nikolay Raykov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  5. Ross Presser
    Ross Presser avatar
    30 posts
    Member since:
    Dec 2008

    Posted 15 Jan 2009 Link to this post

    Unfortunately, while using the RadScriptBlock let me move the script back into the tabbed field where it belongs, it has not worked to fix the Firefox issue. The behavior when a radeditor is removed and then re-added is unchanged: in IE it works fine, and in Firefox after the radeditor is recreated it is frozen, unusable, with neither any tool button nor even typing having any effect.

    I tested a little more, and this freezing effect happens even when the script is absent (and the OnClientExecuting attribute is absent from the RadEditor tag).   If the dropdowns (which are created dynamically, in codebehind) are removed, then the freezing problem does not occur.
  6. Nikolay Raykov
    Admin
    Nikolay Raykov avatar
    102 posts

    Posted 19 Jan 2009 Link to this post

    Hello Ross,

    We have already answered your question in the support ticket that you opened. For your convenience I am pasting the answer here as well:

    "The old code applies to RadEditor Classic (RadE:Editor) and the new one taken from the documentation is for RadEditor for ASP.NET AJAX (telerik:RadEditor).

    You use AJAX, but you move RadEditor in DOM hierarchy. Is that correct? if so, you should call the
    editor.onParentNodeChanged()method directly after the RadEditor reposition.

    Moving an editable frame in the DOM of the page causes it to become corrupt and uneditable in FireFox. This is a known problem (of the browser, not of the RadEditor). We have been able to develop a workaround for the editor that detects the DOM move automatically and executes some code to fix things to work right. The move detection uses DOM Level 2 events supported in FireFox. I am not sure why your editor-moving code does not cause the editor to detect it. However, in your case you should simply call the method that takes care of restoring the editor's editability explicitly, e.g.

    editor.onParentNodeChanged()

    Once again, please note that this problem is purely browser related, and we have done our best to workaround it seamlessly into the editor."

    Regards,
    Nikolay Raykov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  7. Ross Presser
    Ross Presser avatar
    30 posts
    Member since:
    Dec 2008

    Posted 20 Jan 2009 Link to this post

    (We'll continue hammering this out in the tech support issue; when it is all working I will report back to the forum.)
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017