Mark Mark - 4 months ago 9
Javascript Question

Call JQZoom on AJAX Load()

Im using

C# MVC
as my Software. In my page, I Will have a partial View that show Images. Then I will bind these Images with
jqzoom
. I bind it inside
document ready
function and it work well. But every X minutes, I need to refresh my partial View and re-fetching it with new data from
DB
, then bind the new images with Jqzoom too. But then it shows alert 'problem while loading image'

DB would only return the
path string
to the image. So, theres a small possibility that the Image path is not exist. But for the current problem, all images are exist

Here is my code :

@Html.Resource(
@<script>
$(document).ready(function () {
$('.zoom').jqzoom({
zoomType: 'standard',
preloadImages: false,
zoomWidth: 500,
zoomHeight: 500,
title: false
});
$('.zoomPad').css('z-index', 'auto');
});

setInterval(function () {
$('#Display').load('@Url.Action("xx", "xx")', function () {
$('.zoom').jqzoom({
zoomType: 'standard',
preloadImages: false,
zoomWidth: 500,
zoomHeight: 500,
title: false
});
$('.zoomPad').css('z-index', 'auto');
});
}, 1000 * 30 * 1);
</script>, "js")


My Questions :


  1. After some search and tried it so many times, I come out with the conclusion that calling
    jqzoom
    inside the
    .load()
    function would fire the error alert. How to call
    jqzoom
    after reload a partial View?

  2. If some Image path does not exist, will it fire the error alert too?


Answer

Calling jqzoom inside load() would still fire the alert. the only workaround is to check every path image, whether its exist or not. after confirmed, then call the image and jqzoom