Thumbnails image caching problem on renaming file?

4 posts, 0 answers
  1. tomexou
    tomexou avatar
    8 posts
    Member since:
    Oct 2010

    Posted 24 Jun 2015 Link to this post

    I use a FileExplorer to list images on a folder with its ExplorerMode="Thumbnails". The snapshot is as : http://i.imgur.com/cpKRY9j.png

    <telerik:RadFileExplorer runat="server" ID="RadFileExplorer2"
        Height="200px" Width="100%"
        DisplayUpFolderItem="true"
        VisibleControls="Toolbar,FileList,ContextMenus"
        ExplorerMode="Thumbnails"
        EnableCreateNewFolder="false"
        AvailableFileListControls="All"
        >
        <Configuration
            ViewPaths="~/File/Product/5/Image/L"
            UploadPaths="~/File/Product/5/Image/L"
            DeletePaths="~/File/Product/5/Image/L"
            AllowMultipleSelection="true"
            EnableAsyncUpload="true"
            MaxUploadFileSize="20971520"
            SearchPatterns="*.jpg" />
    </telerik:RadFileExplorer>

    I want to swap two images by renaming its name. The rename operation is succeeded but its image is wrong.
    The image seems to be caching and show the old image after ranamed.

    These client functions have be tested such as clearFolderCache(), refresh(), loadFolder(path) on OnClientMove() client event (see official help).
    Unfortunately, it's not working.

    Please kindly give some advices for this, thanks.

  2. Joana
    Admin
    Joana avatar
    70 posts

    Posted 26 Jun 2015 Link to this post

    Hello,

    Thank you for contacting us.

    I tested the described behavior and logged it in our bug tracking system. You could track its progress here in our feedback portal. However, we'll need additional time to investigate the cause of the issue and I'll write you back once I have more information and if there's a possible workaround.


    Regards,
    Joana
    Telerik
    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
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. tomexou
    tomexou avatar
    8 posts
    Member since:
    Oct 2010

    Posted 27 Jun 2015 in reply to Joana Link to this post

    Thanks, Joana.

    The issue which could be reproduced is usually be fixed sooner.
    Expect it.

  5. Vessy
    Admin
    Vessy avatar
    1380 posts

    Posted 30 Jun 2015 Link to this post

    Hi,

    We reviewed the behavior in details and I could confirm that it is a browser behavior.

    A possible way to force the browser to delete the cached images is to add a cache bustlering string to the thumbnails url's. You can achieve that by modifying the client template used for the Listview items (the FileExplorer's thumbnails) in a similar way:
    RadFileExplorer1.FileList.ListView.ClientSettings.DataBinding.ItemTemplate =
            @"<li class=""rfeThumbList rlvI"">
        <a href=""javascript: void 0;"" class=""rfeLink rlvDrag#= isSelected ? ' rfeSelectedLink' : ''#"" data-index=""#= index #"" title=""#= Name #"">
            <span class=""rfeFile#= Telerik.Web.UI.FileExplorerHelper.isWebImage(item.Extension) ? ' rfeImageFile' : '' #"">
            # if(Telerik.Web.UI.FileExplorerHelper.isWebImage(item.Extension)) {#
                <img src=""#= item.Url || Path#?#=Math.random()# "" alt=""#= Name #"" width=""32"" height=""32"" />
            # } else { #
                <span class=""rfeFileIcon #= Telerik.Web.UI.FileExplorerHelper.getThumbnailCSSExtension(item) #""></span>
            # } #
            </span>
            <span class=""rfeThumbTitle"">#= Name #</span>
        </a>
    </li>";

    Please note, that the thumbnails are not the only images which are cached by the browser and you will most probably experience the same behavior when trying to open an image having the same name as an already cached one. This behavior can be workarounded by handling the FileExplorer's ClientFileOpen event like follows:
    <telerik:RadFileExplorer ID="RadFileExplorer1" runat="server" ExplorerMode="Thumbnails" OnClientFileOpen="onFileOpen">
        <Configuration ViewPaths="~/images/Test" UploadPaths="~/images/Test" DeletePaths="~/images/Test" />
    </telerik:RadFileExplorer>
    <script>
        function onFileOpen(explorer, args) {
            var newUrl = args.get_path() + "?" + Math.random();
            args.get_item().set_url(newUrl);
        }
    </script>

    Hope this helps.

    Regards,
    Vessy
    Telerik
    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
Back to Top