This is a migrated thread and some comments may be shown as answers.

RAD Editor Font size problem

1 Answer 157 Views
Editor
This is a migrated thread and some comments may be shown as answers.
chiranth
Top achievements
Rank 1
chiranth asked on 04 Aug 2010, 09:09 PM
Hi Sir/Mam,

I am facing a problem in a RAD telerik editor controls inside an aspx page.  When i type the content inside the editor control and change the font to say (42px)  ,it shows fine and saves. But when i retreive it back , the content is fine , but when i select the content , the Font size dropdownbox displays 7 by default (istead of 42px). Please see the attached image.
Let me know why the editor is behaving in this way.

1 Answer, 1 is accepted

Sort by
0
Rumen
Telerik team
answered on 05 Aug 2010, 09:18 AM
Hi Chiranth,

The RealFontSize dropdown header does not display some initially defined values, but it display the information of the current selection returned by the browser's queryCommandValue method. Since, the Font Size values in IE are static from 1 to 7 points (these are the values of the FontSize command), when the selection has 10px this method returns a value of 1 points, when the selection has 32px font size then the returned info is 6 points, 46px becomes 7.

You should just convert these point values to the corresponding values and set them through the args.set_value() method.

For your convenience I have wrote the code that will replace the point values from 1 to 7 with their appropriate values in pixels in IE, e.g.

Copy Code
<script type="text/javascript">
    function OnClientSelectionChange(editor, args) {
        var tool = editor.getToolByName("RealFontSize");
        if (tool && $telerik.isIE) {
            setTimeout(function() {
                var value = tool.get_value();
 
                switch (value) {
                    case "1":
                        value = value.replace("1", "10px");
                        break;
                    case "2":
                        value = value.replace("2", "13px");
                        break;
                    case "3":
                        value = value.replace("3", "16px");
                        break;
                    case "4":
                        value = value.replace("4", "18px");
                        break;
                    case "5":
                        value = value.replace("5", "24px");
                        break;               
                    case "6":
                        value = value.replace("6", "32px");
                        break;
                    case "7":
                        value = value.replace("7", "46px");
                        break;
                }
 
                tool.set_value(value);
            }, 0);
        }
    }
</script>         
<telerik:RadEditor id="RadEditor1" runat="server" OnClientSelectionChange="OnClientSelectionChange">
    <Content>
        <span style="font-size: 10px;">text</span><br />
        <span style="font-size: 13px;">text</span><br />
        <span style="font-size: 16px;">text</span><br />
        <span style="font-size: 18px;">text</span><br />
        <span style="font-size: 24px;">text</span><br />
        <span style="font-size: 32px;">text</span><br />
        <span style="font-size: 46px;">text</span><br />
    </Content>
</telerik:RadEditor>

You can enhance the example when needed by adding your own checks and conversions.

Sincerely yours,
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
Tags
Editor
Asked by
chiranth
Top achievements
Rank 1
Answers by
Rumen
Telerik team
Share this question
or