Editor in Mobile mode breaks some styles on the page.

3 posts, 1 answers
  1. Nikita
    Nikita avatar
    29 posts
    Member since:
    Apr 2013

    Posted 05 Jan 2018 Link to this post

    I have a page with a RadEditor and a RadWindow. When I set the editor RenderMode to Mobile or Auto the RadWindow shows up kinda screwy. Attached is what the window looks like. here are my RadEditor and RadWindow declarations:

    <telerik:RadWindow ID="rwUploadAttachment" runat="server" NavigateUrl="UploadAttachment.aspx"
        OnClientClose="rwUploadAttachment_ClientClose" OffsetElementID='<%# lbtnUploadAttachment.ClientID %>'
        OpenerElementID='<%# lbtnUploadAttachment.ClientID %>' Behaviors="Resize, Close, Move"
        Modal="True" ReloadOnShow="True" Height="325px" VisibleStatusbar="False" Width="550px"
        Animation="Fade" />
    <telerik:RadEditor ID="reBody" runat="server" ToolsFile="~/RadEditorToolsFile.xml" NewLineMode="Br" AutoResizeHeight="true"
        EditModes="Design" Width="100%" Skin="Metro" RenderMode="Mobile">
        <SpellCheckSettings DictionaryPath="/_layouts/SpellCheckDictionaries/" AllowAddCustom="false" />
        <Languages>
            <telerik:SpellCheckerLanguage Code="en-US" Title="English" />
            <telerik:SpellCheckerLanguage Code="es-ES" Title="Spanish" />
            <telerik:SpellCheckerLanguage Code="fr-FR" Title="French" />
            <telerik:SpellCheckerLanguage Code="de-DE" Title="German" />
        </Languages>
        <Content />
        <CssFiles>
            <telerik:EditorCssFile Value="EditContentArea.css" />
        </CssFiles>
    </telerik:RadEditor>
  2. Answer
    Marin Bratanov
    Admin
    Marin Bratanov avatar
    5114 posts

    Posted 05 Jan 2018 Link to this post

    Hi,

    This probably comes from the mixed RenderModes for the RadWindow control. The editor brings the Lightweight version of the RadWindow in this case (https://docs.telerik.com/devtools/aspnet-ajax/controls/editor/mobile-support/render-modes), and the one you have explicitly declared has the Classic Render Mode.

    You may also find useful this guide on troubleshooting similar issues in the future: http://docs.telerik.com/devtools/aspnet-ajax/general-information/troubleshooting/skins-troubleshooting#incorrect-or-distorted-appearance.

    If this does not resolve the issue, I encourage you to open a support ticket and send us a very small runnable example so we can see the setup and issue. You could also do that here, but since you cannot attach archives in a forum thread, it may be harder to explain the page structure.

    Regards,

    Marin Bratanov
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Nikita
    Nikita avatar
    29 posts
    Member since:
    Apr 2013

    Posted 05 Jan 2018 in reply to Marin Bratanov Link to this post

    Martin, thank you very much for quick and helpful reply, it led me in the right direction.
Back to Top