RadEditor : Font Name : Initial value never gets set in Firefox 2.0

9 posts, 1 answers
  1. carlpro
    carlpro avatar
    21 posts
    Member since:
    Jul 2007

    Posted 19 Feb 2008 Link to this post

    I have a ContentAreaCssFile that contains the following CSS:

    body  
    {  
        font-family:Verdana;  
        font-size:10px;  

    And on the Page Load event, I have the following code:

        var contentArea  =  editor.get_ContentArea();  
        if (contentArea != null)  
        {  
            contentArea.style.fontFamily = "Verdana";  
            contentArea.style.fontSize = "10px";  
        }  
     

    In IE 7, when the user clicks in the body of the Editor, the Font Name and Font Size get correctly set to "Verdana" and "10px".

    However, in Firefox 2.0, then FontName never gets set. After clicking in the editor, it still says "FontName".  Is this a Bug?   Is there a work-around?
  2. Rumen
    Admin
    Rumen avatar
    14031 posts

    Posted 20 Feb 2008 Link to this post

    Hi Carl,

    The observed behavior is browser related and depends on the used browser.
    The editor dropdowns headers display the information supplied by the browser and Firefox does not provide information about the font name when the default font name is used. You can see that the FontName header displays the default font name information in Internet Explorer.

    If you select the content and apply font name Verdana you will see that Firefox will provide the needed font name information and the FontName dropdown header will be updated.

    Best regards,
    Rumen
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. Answer
    Tervel
    Admin
    Tervel avatar
    1337 posts

    Posted 20 Feb 2008 Link to this post

    Hi carlpro,

    Some additional information on this:

    For the built-in commands into the browser's rich edit engine (e.g. commands such as Bold, Italic, FontName, FontSize), the editor relies on using the built-in document.queryCommandValue function to obtain the current state - as it "expects" that this built-in function would return the most accurate information even in more complex scenarios.

    While in IE the queryCommandValue returns "Verdana" correctly, in FF the browser returns an empty string.

    Of course, when the user has actually applied explicitly some font styling using the tool, then the information returned is correct.


    Best regards,
    Tervel
    the Telerik team


    Instantly find answers to your questions at the new Telerik Support Center
  4. carlpro
    carlpro avatar
    21 posts
    Member since:
    Jul 2007

    Posted 25 Feb 2008 Link to this post

    Is there a 'work-around'?  - So when the user clicks in the editor body for the first time using FireFox, the Verdana font will show up as selected in the dropdown.
  5. Tervel
    Admin
    Tervel avatar
    1337 posts

    Posted 27 Feb 2008 Link to this post

    Hi carlpro,

    For your convenience we developed a workaround, however to run it you will need to use the latest Q3 SP2 Prometheus build release from Feb. 25 2008.
    You need to attach to the editor's OnClientSelectionChange event

    <telerik:radeditor runat="server" OnClientSelectionChange="OnClientSelectionChange" .../>

    Here is the code:

    function OnClientSelectionChange(editor, args)  
    {      
        var fontValue = editor.get_document().queryCommandValue("FontName");  
        if (!fontValue)  
        {          
            var curValue = $telerik.getCurrentStyle(editor.getSelectedElement(), "fontFamily");  
            if (curValue)  
            {  
                var fontName = editor.getToolByName("FontName");         
                if (fontName)  
                {  
                    window.setTimeout(function()  
                    {  
                        fontName.updateValue(curValue);  
                    }, 0);  
                }  
            }  
        }          

    We will do our best to integrate this code in the editor at a later stage.
    Let us know if you have additional questions.

    Best regards,
    Tervel
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  6. Paul Haines
    Paul Haines avatar
    68 posts
    Member since:
    Jun 2007

    Posted 24 Jun 2009 Link to this post

    I've hit this issue and, whilst we've sorted the problem with Firefox, (which was a lot harder than first thought because I needed to display the values in points, not pixels), but I was wondering what the equivalent of the above javascript code is for Safari? If it helps it only needs to be compatible with version 3.x or later, rather than any earlier ones.

    (We need to support IE, Firefox and Safari).

    Thanks,
    Paul
  7. Rumen
    Admin
    Rumen avatar
    14031 posts

    Posted 29 Jun 2009 Link to this post

    Hi Paul,

    I tested the provided code in Safari and verified that it works as expected. You can see my test in the attached video. Am I missing something?

    Best regards,
    Rumen
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  8. Albert Shenker
    Albert Shenker avatar
    579 posts
    Member since:
    Mar 2004

    Posted 28 Sep 2011 Link to this post

    I believe there is a typo in the code provided here. The second line should be if (!fontValue), should it not?
  9. Rumen
    Admin
    Rumen avatar
    14031 posts

    Posted 03 Oct 2011 Link to this post

    Hello Albert,

    Yes, it should be if (!fontValue) and I updated the code snippet.


    All the best,
    Rumen
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
Back to Top