JSFとJquery - ajax呼び出しの後にレンダリングされる要素をターゲットにする方法

Question

私は、p：fileUploadコンポーネントとh：graphicImageコンポーネントを含むフォームを持っています。 h：graphicImageコンポーネントは、AJAX経由でファイルをアップロードした後にのみレンダリングされます。

私の問題は、ファイルがアップロードされた後にJcrop（画像クロッピングライブラリ）を実行する必要がありますが、JCropを実行する必要がある画像はajax経由でレンダリングされるため、文書は

私は漠然とこのような何かを持って準備ができている：

<form> 
    <p:fileUpload fileUploadListener="#{personController.uploadFile}" /> 
    <h:graphicImage id="profilePicture" value="images/#{personController.uploadedFile}" rendered="#{personController.fileUploaded}" /> 
</form> 

<script type="text/javascript"> 
$(function() { 
    //Wont get called due to partial page refresh 
    $('#profilePicture').JCrop() 
}) 
</script> 

私はこれをどのように行うことができますか？

Answer 1

フォームをお持ちの場合は、フォームIDを要素に追加する必要があります。 JSFでは、フォームの要素は接頭辞としてフォームのIDを取得します。だから、あなたは要素を検査し、この方法を使用することができます。

$(document).ajaxComplete(function (e, x, s){ 
    if(s.url === 'uploadurl'){ 
     $('#formID\\:profilePicture').JCrop(); 
    } 
}); 

ここでは引数がevent, xhr, settingsあり、コールバックでのAJAX completeイベントインチ