Question

I’ve been trying to hide and show the imgAreaSelect selection box depending on whether a checkbox is checked or not.

I’ve tried:

    var ias = $('#photo').imgAreaSelect({ instance: true });
    ias.setOptions({ show: false });

but it doesn’t seem to do anything.

I have had to resort to:

    $('div.imgareaselect-selection').hide();
    $('div.imgareaselect-border1').hide();
    $('div.imgareaselect-border2').hide();
    $('div.imgareaselect-border3').hide();
    $('div.imgareaselect-border4').hide();
    $('div.imgareaselect-handle').hide();
    $('div.imgareaselect-outer').hide();

but it seems a little cumbersome and I’m sure there must be a better way.

Answer 1

You need to update the instance after you change the options – http://odyniec.net/projects/imgareaselect/usage.html#api-methods . Although in truth, I’m not sure if you should be using { hide: true } or {show: false}.

var ias = $('#photo').imgAreaSelect({ instance: true });
ias.setOptions({ hide: true });
ias.update();