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

Different thumbnail image URL to the "preview panel" image url

1 Answer 104 Views
This is a migrated thread and some comments may be shown as answers.
Top achievements
Rank 1
Gareth asked on 01 Dec 2015, 04:09 PM


We're using the SQL DB adaptor approach to store images for use in your RadEditor / ImageManager.  Our CMS platform enables us to load thumbnail size versions of those images, however I can only see a way to supply ONE image url through when loading the image list, and no way to modify that URL when a user clicks to load the full size image up in the right hand preview panel.  There doesn't seem to be any onLoad type event I can hook to which would allow me to alter that preview image url.  

To be clear, the intention here would be to use a thumbnail url for the thumbnail listings of all images, but then to use the full size image version in the right hand side preview panel when they click on an individual image.

 Is this possible?



1 Answer, 1 is accepted

Sort by
Telerik team
answered on 02 Dec 2015, 02:07 PM
Hi Gareth,

The FileExplorer's client-side ClientFileOpen event is fired just before and item (image in this case) is opened and so this is the place where you can change the url of the item. By design when the control is opening a file it is using the file's path, unless its url is set. Configuring the url of the item just before it is opened will force FileExplorer to use it, instead of the path set to the thumbnail.

For example, you can use a similar logic:
<telerik:RadFileExplorer runat="server" ID="RadFileExplorer1" ExplorerMode="Thumbnails" OnClientFileOpen="onClientFileOpen">
    <Configuration ViewPaths="~/Images" DeletePaths="~/Images" UploadPaths="~/Images" />
    function onClientFileOpen(explorer, args) {
        //get the current path to the image
        var currentPath = args.get_item().get_path();
        //reset the URL to point the original images
        args.get_item().set_url(args.get_item().get_path().replace("_thumb", ""));

I hope this helps.

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 Feedback Portal and vote to affect the priority of the items
Asked by
Top achievements
Rank 1
Answers by
Telerik team
Share this question