2012-05-25 43 views
0

我們一直在使用uploadify進行圖片上傳,prettyPhoto在我們的Rails應用程序中使用lightbox來顯示圖片。如果單獨使用,兩者都會很好地工作現在我們想要在燈箱上顯示uploadify控件,就像dropbox使用,但如果與prettyPhoto一起使用,它會開始尖叫。uploadify with prettyPhoto:未捕獲的異常:調用StartUpload失敗

以下是使用uploadify with prettyPhoto的示例html。

<!DOCTYPE html> 
<html> 
<head> 
    <title>My Uploadify Implementation</title> 
    <link rel="stylesheet" type="text/css" href="uploadify.css"> 
    <link rel="stylesheet" type="text/css" href="prettyPhoto.css" /> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script> 
    <script type="text/javascript" src="jquery.uploadify-3.1.min.js"></script> 
    <script src="jquery.prettyPhoto.js" type="text/javascript"></script> 

    <script type="text/javascript"> 
    $(function() { 
     $('#file_upload').uploadify({ 
      'swf'  : 'uploadify.swf', 
      'uploader' : 'uploadify.php' 
      // Your options here 
     }); 

     $('#closeme').live('click', function() { 
      $.prettyPhoto.close(); 
      return false; 
     }); 

     $("a[rel^='prettyPhoto']").prettyPhoto(); 

    }); 
    </script> 
</head> 
<body> 
<a href="#inline-1" rel="prettyPhoto" >popop</a> 
    <div id="inline-1" style="display:none;"> 
     <p>This is inline content opened in prettyPhoto.</p> 
     <input type="file" name="file_upload" id="file_upload" /> 
    </div> 
</body> 
</html> 

在這裏你會看到鏈接彈出,並通過點擊鏈接,它顯示uploadify上燈箱控制。然後你從磁盤選擇圖像上傳到服務器。選擇圖片後,我面臨兩個問題:

1)獲取有關FF和克羅姆

2)JavaScript錯誤選定的圖像沒有得到關於uploadify的收藏控制上市Error: uncaught exception: Call to StartUpload failed。如果關閉了pupup並再次點擊彈出鏈接,它會顯示文件列表。

Uploadify工作正常,如果我刪除$("a[rel^='prettyPhoto']").prettyPhoto();行。

你有什麼想法如何解決?

此外,如果有人建議其他插件來實現這種Dropbox風格的上傳者,我將不勝感激。

謝謝,阿米特·帕特爾

回答

0

你想要的收藏夾被打開,而不是在頁面加載後,初始化uploadify。原因是因爲如果元素被隱藏,Flash將不會加載。

我看着prettyPhoto api並找不到任何在燈箱打開完成後調用的事件,但這就是您需要做的事情。

+0

RonnieSan,謝謝你的回覆。我會嘗試你的解決方案,並在這裏更新。 –

+0

'changepicturecallback:function(){}'每次圖像顯示時都會調用。我試圖在這個回調中初始化uploadify,但得到相同的錯誤。 –