setting font name drop down default selected

7 posts, 1 answers
  1. ian
    ian avatar
    4 posts
    Member since:
    Oct 2010

    Posted 26 Oct 2010 Link to this post

    i am using version 7.1.2.0 of the editor

    i am trying to set the default font dropdown, right now it always shows new times roman even when i don't have that selection in the dropdown.

    I've tried the code i foudn in other threads:

    var tool = editor.GetToolByName("FontName");
    if (tool)
    {
        tool.set_value("Arial");
    }

    but i get a "Object does not support this proeprty or method" error.

    I've tried Set_value(), setValue(), SetValue(), even UpdateValue() and its variation i saw somewhere. Some doesn't throw an error, but does not set the default value.
  2. Rumen
    Admin
    Rumen avatar
    12848 posts

    Posted 27 Oct 2010 Link to this post

    Hi Ian,

    You can apply the default header value of the FontName dropdown of RadEditor Classic using the code below:

    <script type="text/javascript">
    function OnClientLoad(editor)
    {
        var fontFamily = editor.GetToolByName("FontName");
        setTimeout(function()
        {
            fontFamily.Element.getElementsByTagName("DIV")[0].innerHTML = "Arial";
        }, 100);
    }
    </script>
    <rade:radeditor id="RadEditor1" OnClientLoad="OnClientLoad" EnableDocking="false" runat="server"></rade:radeditor>

    You can see how to change the default font of the content area in this article: Default Font for Editable Content.

    Best regards,
    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
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. ian
    ian avatar
    4 posts
    Member since:
    Oct 2010

    Posted 27 Oct 2010 Link to this post

    The code did not work.

    When i try alert(fontFamily.Element.getElemenetsByTagName("DIV")[0].innerHTML);
    It gives me "Font Name", and not "times new roman".
  5. ian
    ian avatar
    4 posts
    Member since:
    Oct 2010

    Posted 27 Oct 2010 Link to this post

    I am using IE 7 by the way.
    In firefox, the drop down says "Font Name", then changes to "Arial" and then back to "Font Name" when the page finishes loading.
  6. Answer
    Rumen
    Admin
    Rumen avatar
    12848 posts

    Posted 28 Oct 2010 Link to this post

    Hi Ian,

    You have a typo in the getElemenetsByTagName method name. It should be getElementsByTagName.

    The code works in IE on my end, but not in Firefox. I rewrote it by increased the timeout and this fixed the problem in Firefox:

    <script type="text/javascript">
    function OnClientLoad(editor)
    {
        var fontFamily = editor.GetToolByName("FontName");
        var timeout = (document.all) ? timeout = 0 : timeout = 1000;
        setTimeout(function()
        {
            fontFamily.Element.getElementsByTagName("DIV")[0].innerHTML = "Arial";
        }, timeout);
    }
    </script>
    <rade:radeditor id="RadEditor1" OnClientLoad="OnClientLoad" EnableDocking="false" runat="server"></rade:radeditor>

    For your convenience I have attached my test project and a video of how the solution works: http://screencast.com/t/So46o188.

    Kind regards,
    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
  7. ian
    ian avatar
    4 posts
    Member since:
    Oct 2010

    Posted 28 Oct 2010 Link to this post

    The typo was only on here.
    The code does work, it was the timeout issue, i had to set it longer, or else the control defaults it to "new times roman" after the code sets it to Arial.
    Thank you for your help
  8. Jon Shipman
    Jon Shipman avatar
    43 posts
    Member since:
    Nov 2009

    Posted 12 Jan 2011 Link to this post

    In case anyone's interested.  I'm using v2010.3.1109.35 of the RadControls Suite.  Here's the code that works with that version:

    function OnClientLoad(editor, args)
    {
        // This sets the default style for the content when the
        // editor is in edit mode. Any further adjustments to the
        // fonts by the users will override this.
        var style = editor.get_contentArea().style;
        style.fontFamily = 'Trebuchet MS';
        style.fontSize = '11pt';
     
        // This sets the text of the "FontName" and "RealFontSize"
        // to match the style you just set in the above step.
        var fontFamily = editor.getToolByName("FontName");
        var fontSize = editor.getToolByName("RealFontSize");
        var timeout = (document.all) ? timeout = 0 : timeout = 1000;
        setTimeout(function()
        {
            fontFamily._element.getElementsByTagName("span")[0].innerHTML = "Trebuchet MS";
            fontSize._element.getElementsByTagName("span")[0].innerHTML = "11pt";
        }, timeout);
    }
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017