Telerik Image Editor is not showing preview of the image after I updated the localization files with the latest one.

3 Answers 18 Views
Editor
Atul
Top achievements
Rank 1
Iron
Iron
Atul asked on 21 May 2025, 11:19 AM
Hi, refer this convo:- https://www.telerik.com/forums/issue-regarding-localization-for-radeditor-table

I am using app-globalresources.zip localization files provided by Rumen, and I suspect it is not compatible with the version of Telerik.Web.UI.dll used in my application. I am using Telerik DLL of version 2022.3.913.45.



Can you please suggest what I should do?

Upgrade the DLL version or update the localization files with that DLL version.

If yes, can you share with me the compatible localizations for en-US, fr-FR & de-DE for this 
2022.3.913.45. DLL version.

Or, if you suggest upgrading the current DLL version how should I do it?

3 Answers, 1 is accepted

Sort by
0
Accepted
Rumen
Telerik team
answered on 28 May 2025, 01:11 PM

Hi Atul,

Thank you for your message and for sharing the screenshots.

The behavior difference you're observing between the classic and lightweight render modes is expected and stems from a fundamental difference in how layout is handled between the two modes.

In classic render mode, the RadEditor is built using a table-based layout. Tables naturally stretch to accommodate their children and support height inheritance more reliably across browsers. As a result, applying height: inherit works as expected because the parent containers provide a calculable height.

In lightweight render mode, the layout is based on div elements instead of tables. Unlike tables, div elements do not provide height to their children unless an explicit height is defined. Therefore, when height: inherit is applied in lightweight mode, it may not function properly unless all parent containers also have defined heights. This difference can cause the RadEditor to render with minimal height, as seen in your screenshot.

To resolve this, you can either:

  • Set an explicit height (e.g., 400px) in your code when lightweight mode is enabled,

    if (IsLightweightMode)
    {
        Style["height"] = "400px"; // or a more dynamic value
    }

    or
  • Ensure the parent containers in the DOM tree have a defined height so that inherit can resolve properly.


You should weigh and consider if the changes that you have to make to your app to support the lightweight render mode are too much, or if you can keep the classic render mode and just change the position of the back and forth image sprite icons in the File Browser dialogs by:

Replacing the font icons:

.icnForward:before {
    content: "\e100" !important;
}

.icnBack:before {
    content: "\e101" !important;
}

With image icons:

.RadFileExplorer .RadToolBar .icnForward .rtbText {
    background-position: 0 -313px;
}

.RadFileExplorer .RadToolBar .icnBack .rtbText {
    background-position: 0 -333px;
    border: 1px solid red!important;
}

This change can be made in the RadEditor_Dialogs_RTL.css file, which is loaded in the RadEditor dialogs through the property:

DialogsCssFile="./RTL/RadEditor_Dialogs_RTL.css" as shown in the RTL demo.

    Regards,
    Rumen
    Progress Telerik

    Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Telerik family, check out our getting started resources
    Atul
    Top achievements
    Rank 1
    Iron
    Iron
    commented on 29 May 2025, 10:27 AM | edited

    Hi Rumen,

    Thank you for the code snippet. It worked with the classic render mode for Hebrew culture. Screenshot below


    Can you please provide the localisation files supported by the Telerik DLL of version 2022.3.913.45? Also, the image editor preview is not working. Is it related to the localisation file not supported by the current version?



    https://jam.dev/c/f8fcf872-e802-4795-9b1d-3cfbe81a5a23   <- recording 

    An odd behaviour I noticed is that when I open the RadEditor with the inspect window open, the image editor window then works and renders the image. However, when I open the image editor without the inspect window, the image does not load. You can check in the recording.
    Rumen
    Telerik team
    commented on 29 May 2025, 01:23 PM

    You are welcome Atul! Glad that the solution works!

    For the new questions, please open separate tickets/forums so that we can review them separately.

    Are you able to reproduce the problem with the latest version and the RTL demo with enabled/disabled DevTools? Does it happen in Firefox and Edge?

    0
    Rumen
    Telerik team
    answered on 22 May 2025, 03:11 PM

    Hi Atul,

    To address both the localization compatibility and the security vulnerability CVE-2025-3600 available in version 2022.3.913.45, we strongly recommend that you upgrade to the latest version of the Telerik UI for ASP.NET AJAX suite. This is a mandatory requirement in order to properly secure your application against known threats, including CVE-2025-3600.

    Using outdated versions such as 2022.3.913.45 leaves your application exposed, and the localization files I provided for may not be compatible with the current product APIs or features.

    What you should do:

    1. Upgrade the Telerik UI for ASP.NET AJAX to the latest version. This will ensure compatibility, access to the latest features, and most importantly, protection against CVE-2025-3600.
    2. After upgrading, navigate to the \App_GlobalResources folder in the installation package of the latest version. There you will find the official and up-to-date localization resource files, including those for en-US, fr-FR, and de-DE.
    3. You can experiment with these localization files and adjust any custom strings as needed based on your application’s requirements.

    If you need help with upgrading your Telerik DLL, you can refer to this documentation:

    Please let us know if you need further guidance during the upgrade process.

    Regards,
    Rumen
    Progress Telerik

    Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Telerik family, check out our getting started resources
    Atul
    Top achievements
    Rank 1
    Iron
    Iron
    commented on 26 May 2025, 06:32 AM

    Hi Rumen,

    I am following up on this ticket . When I changed to lightweight render mode, I encountered several issues.

    1. The height of the editor windows becomes very small.



    2. The grey line is missing.



    The issue of direction of the arrows is resolved.
    0
    Rumen
    Telerik team
    answered on 27 May 2025, 03:14 PM

    Hi Atul,

    I have the following suggestions:

    1. For the height, you can apply the Height property of RadEditor and increase its height accordingly.
    2. For the missing redDialogSeparator separator - I am unable to reproduce it in the RTL live demo. What you can do is to inspect the generated markup and applied styles to it in DevTools and locate if some CSS class or setting is not altering its appearance. Alternatively, you can import your own class through the dialogCssFile property of RadEditor and override its appearance:

     

    Regards,
    Rumen
    Progress Telerik

    Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Telerik family, check out our getting started resources
    Atul
    Top achievements
    Rank 1
    Iron
    Iron
    commented on 28 May 2025, 11:30 AM

    Hi Rumen,

    For the classic render mode, the height was set to 'inherit', and it was functioning as expected. However, when I switched to the lightweight render mode, the height inheritance stopped working.

    Before change code & screenshot:- 




    After change code & screenshot:- 



    In the code, the analogy to use '''inherit' is 

    Can you please help?
    Tags
    Editor
    Asked by
    Atul
    Top achievements
    Rank 1
    Iron
    Iron
    Answers by
    Rumen
    Telerik team
    Share this question
    or