Uncaught TypeError: Cannot call method 'destroy' of undefined

Question

This error stops my site from scrolling after a modal the in portfolio view (using bootstrap 3) has been clicked on. When you first load the site the error isn't in the console, then once you click on a portfolio piece, the error shows up.

Getting this error in the console:

Uncaught TypeError: Cannot call method 'destroy' of undefined 

And this in the flexslider.js where the error is.

$.flexslider(this,options,instanceId++)
});
else {
    var $slider = $(this).data("flexslider");
    switch(options){
        case "play":
           $slider.play();
           break;
        case "pause":
            $slider.pause();
            break;
        case "stop":
            $slider.stop();
            break;
        case "next":
            $slider.flexAnimate($slider.getTarget("next"),true);
            break;
        case "prev":
        case "previous":
            $slider.flexAnimate($slider.getTarget("prev"),true);
            break;
        case "destroy":
            $slider.destroy();
            break;
        default:
            if(typeof options==="number")
                $slider.flexAnimate(options,true)
      }
   }
  }})(jQuery)

Answer 1

There is HTML markup missing from the modal-body div... specifically this:

<div class="left-col">
    <img class="img-responsive" src="assets/imac.png" alt="">
    <div class="loader"></div>
    <div class="image-wrapper"></div>
</div>

Re-adding it should fix the problem. If you need to hide the div it is probably easier to use CSS ( display:none; ).