Bug Report T298524
Visible to All Users

ImageZoom - The client-side "this.zoomWindow is null" error occurs in 15.1.7

created 9 years ago

Hello,

I recently upgraded our solution from the build 14.2.8.0 to 15.1.7.0.

I'm currently facing a problem with the control Image Zoom and not sure how to address the problem. The control was behaving as expected in 14.2.8.0 and is not working in 15.1.7.0. From the console in javascript I receive the error : this.zoomWindow is null

This error was not present in the previous version. If it can help you, here's the code we are using to create the Image Zoom.

Controller
        public ActionResult PreviewThumbnail(string Data)
        {
            int Id = DecryptId(Data);
            IdentificationPhotoZoomViewModel model = new IdentificationPhotoZoomViewModel();

var docItem = GetResponse(bll.GetDocumentImport(Id)).Element;
            string thumbnailPath = AleopLib.Configuration.SettingsProvider.CurrentSettings.ThumbnailFolder;
            model.ThumbFolder = string.Format(@"{0}/Invoices/{1}", thumbnailPath, docItem.Guid);

return PartialView("_IdentificationPhotoZoom", model);
        }

PartialView
@using AleopWeb.Core.Caching
@using AleopWeb.Core.HtmlHelpers
@using System.Web.UI.WebControls
@model string

<div style="margin-top: 10px;">
    @Html.DevExpress().ImageZoomNavigator(
                settings =>
                {
                    settings.Name = "zoomNavigator";
                    settings.SettingsAutoGeneratedImages.ImageHeight = Unit.Pixel(300);
                    settings.SettingsAutoGeneratedImages.ImageWidth = Unit.Pixel(300);
                    settings.SettingsAutoGeneratedImages.LargeImageHeight = Unit.Pixel(900);
                    settings.SettingsAutoGeneratedImages.LargeImageWidth = Unit.Pixel(900);
                    settings.SettingsAutoGeneratedImages.ThumbnailHeight = Unit.Pixel(75);
                    settings.SettingsAutoGeneratedImages.ThumbnailWidth = Unit.Pixel(75);
                    settings.SettingsAutoGeneratedImages.ImageCacheFolder = Model + "/Thumb/";
                    settings.Styles.Thumbnail.ImageHeight = Unit.Pixel(75);
                    settings.Styles.Thumbnail.ImageWidth = Unit.Pixel(75);

settings.ActiveItemChangeAction = ActiveItemChangeAction.Click;
                    settings.NavigationButtonVisibility = NavigationButtonVisibilityMode.Auto;
                }).BindToFolder(Model + "/").GetHtml()
</div>
<div style="margin-top: 10px;">
    @Html.DevExpress().ImageZoom(
            settings =>
            {
                settings.Name = "imgValidationEdit";
                settings.ShowHint = true;
                settings.EnableExpandMode = true;
                settings.LargeImageLoadMode = LargeImageLoadMode.OnFirstShow;
                settings.SettingsZoomMode.MouseBoxOpacityMode = MouseBoxOpacityMode.Inside;
                settings.SettingsZoomMode.ZoomWindowPosition = ZoomWindowPosition.Right;
                settings.ZoomWindowText = "Zoom Window Text";
                settings.ExpandWindowText = "Expand Window Text";
                settings.AssociatedImageZoomNavigatorName = "zoomNavigator";
            }
        ).GetHtml()
</div>

You can also find in attachment the difference between the render of the two versions.

Thanks in advance for you help, this is a show stopper for our next release.

Show previous comments (6)
Mike (DevExpress) 9 years ago

    Hello Sebastien,

    We are still looking for a permanent solution, and have yet to come up with a workaround or hot fix.
    We will do our best to address this issue as soon as possible and will post updates to this ticket once any news is available.

    Mike (DevExpress) 9 years ago

      Hello,

      While we are working on a fix, we can provide the following temporary solution:
      Add a fake 1*1 px image with the white background and assign it explicitly via the ImageZoomSettings.ImageUrl property:

      C#
      @Html.DevExpress().ImageZoom(settings => { ... settings.ImageUrl = Url.Content("~/Content/EmptyImage.png"); }).GetHtml()
      SN SN
      Sebastien Nadeau 9 years ago

        Thank you really much for the hotfix.
        We tested it and it's working. We had to tweak it a little bit and here's what we had to do (in hope it will help you in finding the solution). Basically we have two scenario on where we use the ImageZoom

        1. We display the imageZoom as part of the page => the fix is working just fine
        2. We display the ImageZoom as a result of a Ajax call on a click :
          On the first click, only the ImageZoomNavigator is displayed and the error this.zoomWindows = null is still displayed. (we can see the emptyImage.png as the Image). If we click again, everything is working fine (both image are correctly loaded and there's no more error). So even if it's not really clean, we call 2 time the ajax method to display the image and it working fine.
          Hope it can help,

        Answers approved by DevExpress Support

        created 9 years ago

        We have fixed the issue described in this ticket and will include the fix in our next maintenance update. To apply this solution before the official update, request a hotfix by clicking the corresponding link for product versions you require.

        Note: Hotfixes may be unavailable for beta versions and updates that are about to be released.

          Disclaimer: The information provided on DevExpress.com and affiliated web properties (including the DevExpress Support Center) is provided "as is" without warranty of any kind. Developer Express Inc disclaims all warranties, either express or implied, including the warranties of merchantability and fitness for a particular purpose. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

          Confidential Information: Developer Express Inc does not wish to receive, will not act to procure, nor will it solicit, confidential or proprietary materials and information from you through the DevExpress Support Center or its web properties. Any and all materials or information divulged during chats, email communications, online discussions, Support Center tickets, or made available to Developer Express Inc in any manner will be deemed NOT to be confidential by Developer Express Inc. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.