0

Goodmorning everyone,

i fighting against this problem for now 3 hours and i can't find a way to win XD i have an ajax upload that on success will open a twitter bootstrap modal window that will load the image, initialize the jcrop and then on close generate a thumb base on the selection.

and this works fine... the real trouble is that i need in the modal the release of the selection and here's the catch i've followed the instruction on the jcrop website but i can't get out.

now that i have explained the problem is time for some code :D

var FileUploader_img_frontale = new qq.FileUploader({
    'element':document.getElementById("img_frontale"),
    'debug':false,
    'multiple':false,
    'action':'http://url.com/upload',
    'allowedExtensions':['jpg','png','jpeg','gif'],'sizeLimit':10485760,
    'onComplete':function(id, fileName, responseJSON){ 
          $('#pbar_img_frontale').css('display','none');
      $('#img-front-body').html('<img id="cropbox1" src="url.com/images/tmp/b444ac06613fc8d63795be9ad0beaf55011936ac/'+responseJSON.filename+'" style="max-width:400px;max-height:400px;"/>');

          function showCoordsFront(c){       $('#_opera_img_frontale').val(responseJSON.filename+'|'+c.x+'|'+c.y+'|'+c.x2+'|'+c.y2+'|0'); }
            $('#cropbox1').Jcrop({
                boxHeight: 400,
                boxWidth:400,
                trueSize: [responseJSON.width,responseJSON.height],
                allowResize: true,
                aspectRatio: 4/3,
                onChange: showCoordsFront,
                onSelect: showCoordsFront,
            },function(){ jcrop1 = this; });
            $('#_opera_img_frontale').val(responseJSON.filename);
            front_uploaded=1;
            $('#modal_img_front').modal('toggle');
         },'onProgress':function(id, fileName, loaded, total){ $('#pbar_img_frontale').css('display','block'); $('#bar_img_frontale').css('width',((loaded*100)/total)+'%'); },'params':{'PHPSESSID':'400659255ef857e043b5ab1651406f50','YII_CSRF_TOKEN':'c8248bc34b5371edf162292691dbcf23dc1e697a'}});

this is the jquery ajax for the uploading file as you can see i've put the 

 function(){ jcrop1 = this; }

needed for grabbing the obj but while it works when i don't upload the image via ajax i don't understand what to do with it cause the release button get jcrop1 as undefined on jquery ready

var jcrop1;
$("#jcrop1-release").click(function(){
   jcrop1.setSelect([0,0,0,0]);
   jcrop1.release();
});

anyone can help me?

thanks in advance

Fabio

Aliceiw
  • 420
  • 5
  • 19
  • complex right? i can't get out of this it's driving me crazy... if i put an alert after jcrop1=this obviously return object but after that it seems that jcrop1 vanish in thin air T_T – Aliceiw Sep 07 '12 at 19:56

1 Answers1

0

ok Guys i've solved this... the problem was in the framework management of the script.. it will put multiple instance of $(document).ready() so one var was in one and the ajax in another... so the solution was to bypass the document.ready and put the global variable outside and it's done it works!!!

Fabio

Aliceiw
  • 420
  • 5
  • 19