2010-08-26 76 views
0

我想使用swfUpload jquery/flash插件上传,并且我遵循Steven Sanderson(http://blog.stevensanderson.com/2008/11/24/jquery-ajax-uploader-plugin-with-progress-bar/)的方法。但我无法让它工作。它在我从他的网站上下载的示例应用程序中工作正常。试图让它起作用我已经尝试直接在我的应用程序中复制他的页面和所有内容,但它仍然不起作用。如何让swfupload与Asp.Net MVC一起工作2

这里的页面:

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml" > 
    <head> 

    <title>File upload</title> 
     <link rel="Stylesheet" href="../../Content/Site.css" /> 
<%--  <script src="../../Scripts/jquery-1.2.6.min.js"></script>--%> 
     <script src="../../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 
     <script type="text/javascript" src="../../Scripts/swfupload.js"></script> 

     <script type="text/javascript" src="../../Scripts/jquery-asyncUpload-0.1.js"></script> 
    </head> 
    <body> 
     <div id="MainContents"> 
      <form enctype="multipart/form-data" method="post"> 
       <h1>Your profile</h1> 
       <p>(In a real app, other form controls would appear here)</p> 
       <p> 
        Upload your photo: <input type="file" id="photo" name="photo" /> 
       </p> 

       <input type="submit" value="Save my profile" /> 
      </form> 
     </div>   
     <script type="text/javascript"> 
      $(function() { 
       $("#photo").makeAsyncUploader({ 
        upload_url: "/Customers/AsyncUpload/", 
        flash_url: '../../Scripts/swfupload.swf', 
        button_image_url: '/Content/blankButton.png', 
        disableDuringUpload: 'INPUT[type="submit"]' 
       }); 
      });   
     </script> 
     <div id="result"></div> 
    </body> 
</html> 

而这里的操作方法:

public Guid AsyncUpload() 
    { 

     return _fileStore.SaveUploadedFile(Request.Files[0]); 
    } 

这是一个CustomersController控制器,我有这个在控制器的开头:

private IFileStore _fileStore = new DiskFileStore(); 

就像他在他的样本中一样。当然,我也有IFileStore接口和DiskFileStore类。

我的js文件和css头标记的所有引用:

<head> 

<title>File upload</title> 
    <link rel="Stylesheet" href="../../Content/Site.css" /> 
    <script src="../../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 
    <script type="text/javascript" src="../../Scripts/swfupload.js"></script> 
    <script type="text/javascript" src="../../Scripts/jquery-asyncUpload-0.1.js"></script> 
</head> 

(虽然我已经使用了最新的jQuery我,而不是1.2.6这是他自己的样品中有) 。我知道至少脚本是被触发的,因为在FireBug中,我可以看到输入被动态地改变为flash对象,就像它应该是的。

事情是,AsyncUpload()甚至永远不会被调用。我在那里设置了一个永远不会到达的断点。我得到了不同的错误。我第一次尝试它时,脚本的警告框中出现了302错误。 (当时我在同一页面上有其他jQuery脚本,所以我只用这些脚本开始了一个更清晰的页面)。但是现在我没有收到任何错误,我可以选择图片和所有内容,但只是在文本显示“上传...”的阶段停止播放,但我没有看到进度条或任何内容,永远不会完成。

任何想法我做错了什么?

+0

SWFUpload的没有用MVC为你工作? – 2013-01-08 06:16:33

回答

0

事实证明,问题是它没有在Firefox中工作,只有IE浏览器(用于更改...)。饼干的东西。对于任何感兴趣的人,请参阅上面我提到的Steven Sanderson博客中的评论部分!

1

使用下面的CSS固定Firefox的问题

DIV.ProgressBar { 
    width: 100px; padding: 0; border: 1px solid black; margin-right: 1em; 
    height:.75em; margin-left:1em; display:-moz-inline-stack; 
    display:inline-block; zoom:1; *display:inline; 
} 
DIV.ProgressBar DIV { 
    background-color: Green; font-size: 1pt; height:100%; float:left; 
} 
SPAN.asyncUploader OBJECT { 
    position: relative; top: 5px; left: 10px; 
} 
相关问题