2011-08-03 2 views
0

いくつかのページでは、wkhtmloptfでPDFを作成するページ(createPDF.php)を呼び出すリンクを表示し、ダウンロードボックスには最大30秒かかることがあります。ファイル(URL)を生成してロードする際のjQueryダイアログ

ページを読み込んでいる間にメッセージを表示し、ダウンロードボックスが表示されたら消えるダイアログ(jQuery UIを使用)を表示したいと思います。今

:PDFアイコンを

  1. ユーザーのクリック、それは 、ユーザーがページの向きとページのフォーマットを選択するにはjQuery UIのダイアログを開きます。やる「PDFを生成」に
  2. ユーザーがクリックする、:

    (this).dialog("close"); // Close current dialog (Select page orientation, ...) 
    $("#dialog-modal").dialog("open"); // Open new dialog (Please wait while ....) 
    window.location.href = "<?php echo URL; ?>createPDF.php"; (generate and load the PDF) 
    // dialog should close here once the above URL is loaded 
    

表示されますが、ダウンロードボックスがポップアップ表示時に消えない「しばらくお待ちください」を示すダイアログが表示されます。

前もって感謝します!

編集:

は、私は次のコードで、アヤックスでファイルをロードしよう:

$.ajax({ 
    url: "<?php echo URL; ?>createPDF.php", 
    async: false, 
    beforeSend: function(xhr) { 
     xhr.overrideMimeType('application/octet-stream'); 
    }, 
    success: function(content) { 
     $("#dialog-modal").dialog("close"); 
    } 
}); 

PDFいったんクローズダイアログが発生したが、私は何のダウンロードボックスを取得していません。.. 。

編集3:

最後に私がティメオとblockUIを使用utを閉じます。ユーザーは、必要に応じてメッセージボックスを閉じることもできます。

$(this).dialog("close"); 
$.blockUI({ message: '<div style="padding: 20px;"><div style="font-size: 20px;">Veuillez patienter pendant que votre PDF est généré.</div> <br /> Ceci peut prendre quelques secondes. <br /> <br /> Ce message peut disparaître avant que le téléchargement ne commence.</div>' });  
$('.blockOverlay').attr('title','Cliquez pour fermer ce message').click($.unblockUI); 
var pdfFormat = $('#pdfFormat').val(); 
var pdfOrientation = $('#pdfOrientation').val(); 
pdfURL = pdfURL + "&f=" + pdfFormat + "&o=" + pdfOrientation; 
window.location.href = pdfURL; 
setTimeout(
    function(){ 
     $.unblockUI(); 
    }, 5000); 

答えて

0

最後に、blockUIを使用してタイムアウトを設定して閉じました。ユーザーは、必要に応じてメッセージボックスを閉じることもできます。

$(this).dialog("close"); 
$.blockUI({ message: '<div style="padding: 20px;"><div style="font-size: 20px;">Veuillez patienter pendant que votre PDF est généré.</div> <br /> Ceci peut prendre quelques secondes. <br /> <br /> Ce message peut disparaître avant que le téléchargement ne commence.</div>' });  
$('.blockOverlay').attr('title','Cliquez pour fermer ce message').click($.unblockUI); 
var pdfFormat = $('#pdfFormat').val(); 
var pdfOrientation = $('#pdfOrientation').val(); 
pdfURL = pdfURL + "&f=" + pdfFormat + "&o=" + pdfOrientation; 
window.location.href = pdfURL; 
setTimeout(
    function(){ 
     $.unblockUI(); 
    }, 5000); 
0

this postの方法を試してみてください。しかし、画像を使用してそれを表示する代わりに、$.ajaxStart()$.ajaxStop()のダイアログで、ダイアログを作成してから破棄してください。あるいは、先にopen/closeダイアログを初期化してください。

関連する問題