Rails + jQuery：更新コンテナの後でクロッピングが機能しない

Question

コンテナの更新に関する質問があります。遅延したジョブを使用して、背景が にリサイズされた画像があります。終了すると、属性をfalseに設定します。 ビューはこの属性を500msごとにチェックしています。 完了後、ビューでイメージが更新され、ユーザーにクロップボックスが表示されます。

これまでのところ、すべてが次のようになります。

<div id='edit_image'> 
    <div class='image'> 
    <img alt="spinner" src="/images/spinner.gif" /> 
    </div> 
</div> 


    $(window).load(function() { 

     var jcrop_api; 
     image_crop = $.Jcrop('#imagecrop', 
     { 
      aspectRatio: 430/575, 
      trueSize: [#{@asset.image.width}, #{@asset.image.height}], 
      minSize: [430, 575], 
      allowSelect: false, 
      onChange: updateCrop, 
      onSelect: updateCrop  
     }); 
     imagecrop_api.setSelect(#{to_jcrop(@asset.crop)}); 

    }); 

    function updateCrop(c) { 
     $('#image_crop').val(c.w +"x"+ c.h +"+"+ c.x +"+"+ c.y); 
    }; 

    $(document).ready(function() { 
     var refresh_timer = setInterval(check_image_status, 200); 

     function check_image_status() { 
     $.post('/assets/' + "#{@asset.id}" + '/asset_resizing', 
      function(data) { 
      if (data == false) { 
       $('.image').html('#{ image_tag @asset.image.url, :id => 'edit_image', :class => 'image'}'); 
       clearInterval(refresh_timer); 
      } else { 
       return false; 
      } 
     }); 
     }; 
    }); 

画像が正常にロードされ、コンテナが更新します。唯一の問題は、それ以降は私がもう作物をすることができないということです。イメージを直接ロードすると、切り抜きが機能します。 ありがとうございました。

Answer 1

ねえ。サーバーからの応答を処理するためにupdate.js.erbをレンダリングする場合は、このコードをupdate.js.erbファイルに置く必要があります。

$(window).load(function() { 

     var jcrop_api; 
     image_crop = $.Jcrop('#imagecrop', 
     { 
      aspectRatio: 430/575, 
      trueSize: [#{@asset.image.width}, #{@asset.image.height}], 
      minSize: [430, 575], 
      allowSelect: false, 
      onChange: updateCrop, 
      onSelect: updateCrop  
     }); 
     imagecrop_api.setSelect(#{to_jcrop(@asset.crop)}); 

    });