Jcrop Destroy is not working

Jak
Jak
Member
380 Points
155 Posts

I'm trying to implement zoom-in and zoom-out and trying to reload jcrop by destroying it as:

$(function(){

   var scalex = $('#scalex').val();
   var scaley = $('#scaley').val();
   var myJcrop = $('#imgCropImage').Jcrop({
       aspectRatio: 1,
       onSelect: updateCoords,
       boxWidth: scalex,
       boxHeight: scaley
   });

   $('#imgtarget').click(function() {
      myJcrop.destroy();
      scalex = $('#scalex').val();
      scaley = $('#scaley').val();
      myJcrop = $('#imgCropImage').Jcrop({
          aspectRatio: 1,
          onSelect: updateCoords,
          boxWidth: scalex,
          boxHeight: scaley
      });
   });

});

But it's not working. Getting error message in console as "destroy is not a function"

Views: 50
Total Answered: 2
Total Marked As Answer: 0
Posted On: 04-Jan-2020 02:35

Share:   fb twitter linkedin
Answers
Smith
Smith
Participant
454 Points
122 Posts
         

Maybe you can try something like:

$(function(){

   var scalex = $('#scalex').val();
   var scaley = $('#scaley').val();
   var myJcrop = $.Jcrop('#imgCropImage',{
       aspectRatio: 1,
       onSelect: updateCoords,
       boxWidth: scalex,
       boxHeight: scaley
   });

   $('#imgtarget').click(function() {
      myJcrop.destroy();
      scalex = $('#scalex').val();
      scaley = $('#scaley').val();
      myJcrop = $.Jcrop('#imgCropImage',{
          aspectRatio: 1,
          onSelect: updateCoords,
          boxWidth: scalex,
          boxHeight: scaley
      });
   });

});
Posted On: 04-Jan-2020 03:03
beginer
beginer
104 Points
37 Posts
         

I was facing same issue resolved by removing Jcrop  from element  as:

if ($('#imgCropImage').data('Jcrop')) {
   $('#imgCropImage').data('Jcrop').destroy();
}

So you can try following:

$(function(){

   var scalex = $('#scalex').val();
   var scaley = $('#scaley').val();
   var myJcrop = $.Jcrop('#imgCropImage',{
       aspectRatio: 1,
       onSelect: updateCoords,
       boxWidth: scalex,
       boxHeight: scaley
   });

   $('#imgtarget').click(function() {
      if ($('#imgCropImage').data('Jcrop')) {
         $('#imgCropImage').data('Jcrop').destroy();
        }
      scalex = $('#scalex').val();
      scaley = $('#scaley').val();
      myJcrop = $.Jcrop('#imgCropImage',{
          aspectRatio: 1,
          onSelect: updateCoords,
          boxWidth: scalex,
          boxHeight: scaley
      });
   });

});
Posted On: 04-Jan-2020 03:12
 Log In to Chat